//初始化文件
Schema.init(true);
$(function () {
    Designer.init();
	if (typeof isView != "undefined") {
		return
	}
	if (Designer.status == "readonly") {
		if (localRuntime == false) {
			Designer.setReadonly(true)
		}
	} else {
		UI.init();
	}
    // UI.init();
});
//显示区基本组件设置
var Designer = {
    config: {//配置组件基本信息
        panelItemWidth: 30,    // 宽
        panelItemHeight: 30,    // 高
        pageMargin: 0,
        anchorSize: 10,//锚点大小
        anchorColor: "#15bccc",//锚点颜色
        rotaterSize: 9,//旋转点大小
        selectorColor: "#6EB1EB",
        scale: 1//比例
    },
    initialize: {//初始化
        initialized: false,//
        initLayout: function () {//初始化画布高度
            $(window).bind("resize.designer", function () {
                var a = IS_FULL_SCREEN ? $(window).height() : $(window).height() - $("#designer_header").outerHeight();
                // $(".leftMenu").height(a);
            });
            $(window).trigger("resize.designer");
        },
        initModel: function () {//初始化模板
            Model.define = {//变量
                page: Utils.copy(Schema.pageDefaults),
                elements: {}
            };
            Model.persistence = {//留存
                page: Utils.copy(Schema.pageDefaults),
                elements: {}
            }
        },
        initCanvas: function () {
            var l;
            try{
                // l = Model.define.page.width.toScale();
                l = Model.define.page.width;
            }catch (e){
                Model.define.page = {
                    "width": "100%",
                    "height": "100%",
                    "padding": 0,
                    "backgroundImage": 'designer/images/bj1.png'
                }
            }
            // var f = Model.define.page.height.toScale();
            var f = Model.define.page.height;
            $("#canvas_container").css({width: l, height: f, padding: Designer.config.pageMargin});
        },
        initShapes: function () {//初始化左侧栏
            $("#shape_panel").empty();
            for (var f = 0; f < Schema.categories.length; f++) {
                var g = Schema.categories[f];
                $("#shape_panel").append("<div class='panel_container'><div class='leftMenuBtn leftMenuBtn_hide' title='隐藏侧栏'></div><div class='dragDiv'></div><div id='panel_" + g.name + "' class='content'></div></div>");
            }
            for (var b in Schema.shapes) {
                var j = Schema.shapes[b];
                if (j.attribute.visible) {
                    if (!j.groupName) {
                        e(j);
                    }
                }
            }
            function e(l) {
                //插入显示元素方法
                var l = Utils.copy(l);
                var n = "<div class='iconBg panel_box' shapeName='" + l.name +"'>" +"<i class='title boxShow' >"+l.title+"</i>"+ l.samplePictures +"</div>";
                $(n).appendTo("#panel_" + l.category);
            }
            //拖动组件
            c();
            function c() {
                $(".panel_box").off().on("mousedown", function (s) {
                    if(!IS_MOVE ){
                        return
                    }
                    if($(s.target).hasClass("panel_box") || $(s.target).parents(".panel_box").length > 0){
                        var nowpanel = $(s.target).hasClass("panel_box") ? $(s.target) : $(s.target).parents(".panel_box");
                        var nowtype = nowpanel.attr("shapename");
                        if(nowtype === "moreComputer"){
                            $(".cpBg").show();
                            return;
                        }
                        if(MAXLENELEMENT[nowtype] > 0){
                            var len = 0;
                            for(var i in Model.define.elements){
                                if(Model.define.elements[i].name === nowtype){
                                    len++;
                                }
                            }
                            if(len >= MAXLENELEMENT[nowtype]){
                                return;
                            }
                        }else if(MAXLENELEMENT[nowtype] == 0){
                            return;
                        }
                    }
                    var p = $(this);
                    if (p.hasClass("readonly")) {
                        return;
                    }
                    var i = p.attr("shapeName");
                    var l = null;
                    var q = null;
                    var o = $("#designer_canvas");
                    var m = a(i);
                    $("#designer").bind("mousemove.creating", function (t) {
                        h(m, t);
                    });
                    $("#canvas_container").bind("mousemove.create", function (A) {
                        var v = Utils.getRelativePos(A.pageX, A.pageY, o);
                        if (l == null) {
                            l = d(i, v.x, v.y);
                            q = $("#" + l.id);
                            q.attr("class", "shape_box_creating");
                        }

                        function addCp(){
                            if(nowtype === "addComputer"){
                                for(_i in Model.define.elements){
                                    if(Model.define.elements[_i].name === "addComputer"){
                                        var props=Model.define.elements[_i].props;
                                        props.size=Model.define.elements[_i].fontStyle.size;
                                        return props;
                                    }
                                }
                            }
                        }
                       if(nowtype === "addComputer"){
                           var _props= addCp() !== undefined ? addCp():{ w: 32, h: 22,size:cp_size};
                           l.props.w=_props.w;
                           l.props.h=_props.h;
                           l.fontStyle.size=_props.size;
                           cp_size=_props.size;
                           cp_width=_props.w;
                           q.css({
                               width:_props.w,
                               height:_props.h,
                               left: v.x - _props.w / 2 + "px",
                               top: v.y - _props.h / 2 + "px",
                               "z-index": Model.orderList.length
                           });
                       }else{
                           q.css({
                               left: v.x - q.width() / 2 + "px",
                               top: v.y - q.height() / 2 + "px",
                               "z-index": Model.orderList.length
                           });
                       }
                        // $(" .sliderBf" ).slider("value",cp_width) ;
                        $(" .fuChuang" ).html(cp_width+"px") ;
                        $(".text_cp").html(cp_size+"px");
                        l.props.x = v.x.restoreScale() - l.props.w / 2;
                        l.props.y = v.y.restoreScale() - l.props.h / 2;
                        var z = l.props;
                        var y = Designer.op.snapLine(z, [l.id], true, l);
                        if (y.attach) {
                            l.attachTo = y.attach.id
                        } else {
                            delete l.attachTo
                        }
                        if (y.container) {
                            j.container = y.container.id
                        } else {
                            delete j.container
                        }
                        var tempIndex = 2;
                        tempIndex += Model.orderList.length;
                        q.css({
                            left: (l.props.x).toScale() + "px",
                            top: (l.props.y).toScale() + "px",
                            "z-index": tempIndex
                        });
                        l.props.zindex = tempIndex;
                    });
                    var n = false;
                    $("#canvas_container").bind("mouseup.create", function () {
                        n = true;
                    });
                    $(document).bind("mouseup.create", function () {
                        $(this).unbind("mouseup.create");
                        $("#designer").unbind("mousemove.creating");
                        $("#creating_shape_container").hide();
                        Designer.op.hideSnapLine();
                        $("#canvas_container").unbind("mouseup.create").unbind("mousemove.create");
                        if (l != null) {
                            if(IS_FIRST_ELEMENT){
                                IS_FIRST_ELEMENT = false;
                            }
                            if(l.props.x < 0 || l.props.y < 0 || Model.define.page.width - (l.props.x + l.props.w) < 0 || Model.define.page.height - (l.props.y + l.props.h ) < 0){
                                $("#"+ l.id).remove();
                                return false;
                            }
                            $(".computer-top-nav").css({
                                left: parseInt(l.props.x) - 38 + "px",
                                top: l.props.y + "px",
                                display: "block"
                            }).attr("data-id", l.id);
                            if(l.name === 'transverseline' || l.name === 'longstring' || l.name === 'text' || l.name === 'arrow' || l.name === 'myPlace' ||l.name === 'obstacle'){
                                $(".component-color").show();
                            }else{
                                $(".component-color").hide();
                            }
                            if(l.name === 'arrow' || l.name === 'myPlace' || l.name === 'obstacle' || l.name === 'mapTime'){
                                $(".component-set").show();
                            }else{
                                $(".component-set").hide();
                            }
                            if(l.name === 'text'){
                                $(".component-setFontW").show();
                                $(".component-setFontS").show();
                                $(".component-setColor").show();
                            }else{
                                $(".component-setFontW").hide();
                                $(".component-setFontS").hide();
                                $(".component-setColor").hide();
                            }
                            if(l.name === 'transverseline' || l.name === "longstring"){
                                $(".component-linewidth").show();
                            }else{
                                $(".component-linewidth").hide();
                            }
                            if (n == false) {
                                q.remove();
                            } else {
                                MessageSource.beginBatch();
                                if (l.onCreated) {
                                    var J = l.onCreated();
                                    if (J == false) {
                                        q.remove();
                                        MessageSource.commit();
                                        return;
                                    }
                                }
                                q.attr("class", "shape_box ").css("z-index", l.props.zindex);
                                q.find(".cpNum").css("font-size",cp_size+"px");
                                Designer.events.push("created", l);
                                Model.add(l);
                                Utils.unselect();
                                Utils.selectShape(l.id);
                                MessageSource.commit();
                            }
                            var undo = $("#bar_undo");
                            if(undo.hasClass("disabled")){
                                undo.removeClass("disabled");
                            }
                            $("#bar_redo").button("disable");
                        }
                        p.css({left: "0px", top: "0px"});
                        Designer.op.resetState();
                    });
                });
            }
            function a(m) {
                var l = $("#creating_shape_canvas");
                var i = $("#creating_shape_container");
                if (l.length == 0) {
                    i = $("<div id='creating_shape_container'></div>").appendTo("#designer");
                    l = $("<canvas id='creating_shape_canvas' width='" + (Designer.config.panelItemWidth) + "' height='" + (Designer.config.panelItemHeight) + "'></canvas>").appendTo(i);
                }
                i.css({
                    left: "0px",
                    top: "0px",
                    width: $(".panel_container").width(),
                    height: $("#shape_panel").outerHeight(),
                    display: 'none'
                });
                return l;
            }
            function h(l, m) {
                // $("#creating_shape_container").show();
                var i = Utils.getRelativePos(m.pageX, m.pageY, $("#creating_shape_container"));
                l.css({left: i.x - Designer.config.panelItemWidth / 2, top: i.y - Designer.config.panelItemHeight / 2});
            }
            function d(o, q, p) {
                var l = Schema.shapes[o];
                var i = q.restoreScale() - l.props.w / 2;
                var r = p.restoreScale() - l.props.h / 2;
                var m = Model.create(o, i, r);
                Designer.painter.renderShape(m);
                return m;
            }
        }
    },
    hotkey: {
        init: function () {
            var a = null;
            $(window).unbind("keydown.hotkey").bind("keydown.hotkey", function (j) {
                if ((j.ctrlKey || j.metaKey) && j.keyCode == 83) {
                    j.preventDefault();
                } else {
                    if ((j.ctrlKey || j.metaKey) && j.keyCode == 65) {//全选
                        Designer.selectAll();
                        j.preventDefault();
                    } else {
                        if (j.keyCode == 46 || j.keyCode == 8) {//删除
                            if(OPERATION) {
                                return;
                            }
                            IS_EXIT_SAVE = false;
                            Designer.op.removeShape();
                            cpWSetShow();
                            $("#shape_controls,#toolBarSizeDiv,#CPNum,#setHf,#font_f,#font_s,#color_picker,#background_picker,#line_width_list").hide();
                            j.preventDefault();
                        } else {
                            if ((j.ctrlKey || j.metaKey) && j.keyCode == 90) {//撤消
                                IS_EXIT_SAVE = false;
                                MessageSource.undo();
                                j.preventDefault();
                            } else {
                                if ((j.ctrlKey || j.metaKey) && j.keyCode == 89) {//恢复
                                    IS_EXIT_SAVE = false;
                                    MessageSource.redo();
                                    j.preventDefault();
                                } else {
                                    if ((j.ctrlKey || j.metaKey) && !j.shiftKey && j.keyCode == 67) {//复制
                                        Designer.clipboard.copy();
                                        IS_EXIT_SAVE = false;
                                        j.preventDefault();
                                    } else {
                                        if ((j.ctrlKey || j.metaKey) && j.keyCode == 88) {//剪切
                                            //IS_EXIT_SAVE = false;
                                            //Designer.clipboard.cut();
                                            j.preventDefault();
                                        } else {
                                            if ((j.ctrlKey || j.metaKey) && j.keyCode == 86) {//粘贴
                                                IS_EXIT_SAVE = false;
                                                Designer.clipboard.paste();
                                                j.preventDefault();
                                            } else {
                                                if ((j.altKey || j.metaKey) && (j.keyCode == 187 || j.keyCode == 107)) {
                                                    IS_EXIT_SAVE = false;
                                                    Designer.zoomIn();
                                                    j.preventDefault();
                                                } else {
                                                    if ((j.altKey || j.metaKey) && (j.keyCode == 189 || j.keyCode == 109)) {
                                                        IS_EXIT_SAVE = false;
                                                        Designer.zoomOut();
                                                        j.preventDefault();
                                                    } else {
                                                        if (j.keyCode >= 37 && j.keyCode <= 40) {
                                                            if(OPERATION){
                                                                return;
                                                            }
                                                            IS_EXIT_SAVE = false;
                                                            if(Utils.getSelected().length === 1 && Utils.getSelected()[0].nodel) return;
                                                            if (a == null || Utils.getSelected().length > 0) {
                                                                var d = Utils.getSelected();
                                                                var m = Utils.getFamilyShapes(d);
                                                                d = d.concat(m);
                                                                var g = Utils.getContainedShapes(d);
                                                                a= d.concat(g);
                                                            }
                                                            if (a.length > 0) {
                                                                j.preventDefault();
                                                                var b = 1;
                                                                if (j.ctrlKey) {
                                                                    b = 10;
                                                                }
                                                                if (j.keyCode == 37) {
                                                                    if(Math.floor(parseFloat($("#shape_controls").css("left"))) - b <= 0){
                                                                        return false;
                                                                    }
                                                                    Designer.op.moveShape(a, {x: -b, y: 0});
                                                                    $(".computer-top-nav").css("left", parseInt($(".computer-top-nav").css("left")) - b);
                                                                    $(".top-align-list2").css("left", parseInt($(".top-align-list2").css("left")) - b);
                                                                } else {
                                                                    if (j.keyCode == 38) {
                                                                        if(Math.floor(parseFloat($("#shape_controls").css("top"))) - b <= 0){
                                                                            return false;
                                                                        }
                                                                        $(".computer-top-nav").css("top", parseInt($(".computer-top-nav").css("top")) - b);
                                                                        $(".top-align-list2").css("top", parseInt($(".top-align-list2").css("top")) - b);
                                                                        Designer.op.moveShape(a, {x: 0, y: -b});
                                                                    } else {
                                                                        if (j.keyCode == 39) {
                                                                            if(Math.floor(parseFloat($("#shape_controls").css("left"))) + Math.ceil(parseFloat($("#shape_controls").attr("data-width"))) + b >= Model.define.page.width){
                                                                                return false;
                                                                            }
                                                                            Designer.op.moveShape(a, {
                                                                                x: b,
                                                                                y: 0
                                                                            })
                                                                            $(".computer-top-nav").css("left", parseInt($(".computer-top-nav").css("left")) + b);
                                                                            $(".top-align-list2").css("left", parseInt($(".top-align-list2").css("left")) + b);
                                                                        } else {
                                                                            if (j.keyCode == 40) {
                                                                                if(Math.floor(parseFloat($("#shape_controls").css("top"))) + Math.ceil(parseFloat($("#shape_controls").attr("data-height"))) + b + 40 >= Model.define.page.height){
                                                                                    return false;
                                                                                }
                                                                                $(".computer-top-nav").css("top", parseInt($(".computer-top-nav").css("top")) + b);
                                                                                $(".top-align-list2").css("top", parseInt($(".top-align-list2").css("top")) + b);
                                                                                Designer.op.moveShape(a, {
                                                                                    x: 0,
                                                                                    y: b
                                                                                });
                                                                            }
                                                                        }
                                                                    }
                                                                }
                                                                $(document).unbind("keyup.moveshape").bind("keyup.moveshape", function () {
                                                                    Model.updateMulti(a);
                                                                    a = null;
                                                                    $(document).unbind("keyup.moveshape");
                                                                })
                                                            }
                                                        } else {
                                                            if ((j.ctrlKey || j.metaKey) && j.keyCode == 221) {
                                                                IS_EXIT_SAVE = false;
                                                                var l = "front";
                                                                if (j.shiftKey) {
                                                                    l = "forward";
                                                                }
                                                                Designer.layerShapes(l);
                                                            } else {
                                                                if ((j.ctrlKey || j.metaKey) && j.keyCode == 219) {
                                                                    var l = "back";
                                                                    if (j.shiftKey) {
                                                                        l = "backward";
                                                                    }
                                                                    Designer.layerShapes(l);
                                                                } else {
                                                                    if ((j.ctrlKey || j.metaKey) && j.keyCode == 71) {
                                                                        j.preventDefault();
                                                                        if (j.shiftKey) {
                                                                            IS_EXIT_SAVE = false;
                                                                        }
                                                                    } else {
                                                                        if ((j.ctrlKey || j.metaKey) && j.keyCode == 76) {
                                                                            j.preventDefault();
                                                                            if (j.shiftKey) {
                                                                                IS_EXIT_SAVE = false;
                                                                                Designer.unlockShapes();
                                                                            } else {
                                                                                Designer.lockShapes();
                                                                            }
                                                                        } else {
                                                                            if (j.keyCode == 18) {
                                                                                IS_EXIT_SAVE = false;
                                                                            } else {
                                                                                if (j.keyCode == 27) {
                                                                                    if(OPERATION){
                                                                                        return;
                                                                                    }
                                                                                    IS_EXIT_SAVE = false;
                                                                                    if (!Designer.op.state) {
                                                                                        Utils.unselect();
                                                                                    }
                                                                                } else {
                                                                                    if (j.keyCode == 84 && !(j.ctrlKey || j.metaKey)) {
                                                                                        $(".menu.list").hide();
                                                                                        IS_EXIT_SAVE = false;
                                                                                    } else {
                                                                                        if (j.keyCode == 76 && !(j.ctrlKey || j.metaKey)) {
                                                                                            $(".menu.list").hide();
                                                                                            $("#designer_contextmenu").hide();
                                                                                            $(".setStateDiv").hide();
                                                                                        } else {
                                                                                            if (j.keyCode == 66 && (j.ctrlKey || j.metaKey)) {
                                                                                                var i = Utils.getSelectedIds();
                                                                                                if (i.length > 0) {
                                                                                                    var h = Model.getShapeById(i[0]);
                                                                                                    var c = Utils.getShapeFontStyle(h.fontStyle);
                                                                                                    UI.update();
                                                                                                }
                                                                                                j.preventDefault();
                                                                                            } else {
                                                                                                if (j.keyCode == 73 && (j.ctrlKey || j.metaKey)) {
                                                                                                    var i = Utils.getSelectedIds();
                                                                                                    if (i.length > 0) {
                                                                                                        var h = Model.getShapeById(i[0]);
                                                                                                        var c = Utils.getShapeFontStyle(h.fontStyle);
                                                                                                        UI.update();
                                                                                                    }
                                                                                                    j.preventDefault();
                                                                                                } else {
                                                                                                    if (j.keyCode == 85 && (j.ctrlKey || j.metaKey)) {
                                                                                                        var i = Utils.getSelectedIds();
                                                                                                        if (i.length > 0) {
                                                                                                            var h = Model.getShapeById(i[0]);
                                                                                                            var c = Utils.getShapeFontStyle(h.fontStyle);
                                                                                                            UI.update();
                                                                                                        };
                                                                                                        j.preventDefault();
                                                                                                    } else {
                                                                                                        if (j.keyCode == 121) {
                                                                                                            j.preventDefault();
                                                                                                            Dock.enterPresentation();
                                                                                                        }
                                                                                                    }
                                                                                                }
                                                                                            }
                                                                                        }
                                                                                    }
                                                                                }
                                                                            }
                                                                        }
                                                                    }
                                                                }
                                                            }
                                                        }
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            });
            $("input,select").off().on("keydown.hotkey", function (b) {
                b.stopPropagation();
            });
        },
        cancel: function () {
            $(window).unbind("keydown.hotkey");
        }
    },
    contextMenu: {
        init: function () {
            $("#designer_contextmenu").unbind("mousedown").bind("mousedown", function (a) {
                a.stopPropagation();
            });
            $("#designer_contextmenu").find("li").unbind("click").bind("click", function (e) {
                //e.stopPropagation();
                var a = $(this);
                if(a.attr("ac")==="setState"){
                    $(".setStateDiv").show();
                    return ;
                }else if (!a.menuitem("isDisabled") && a.children(".extend_menu").length == 0) {
                    Designer.contextMenu.execAction(a);
                    Designer.contextMenu.hide();
                    $(".setStateDiv").hide();
                }
            });
            $("#canvas_container").unbind("contextmenu").bind("contextmenu", function (b) {
                b.preventDefault();
                var a = $("#designer_canvas");
                var c = Utils.getRelativePos(b.pageX, b.pageY, a);
                var paramSize = {
                    w: 220,
                    h: 43
                }
                if($(b.target).hasClass("shape_box") || $(b.target).parents(".shape_box").length > 0){
                    paramSize.h = 156;
                }

                $(".setStateDiv").css("left","100%");
                if(c.x + paramSize.w > Model.define.page.width){
                    c.x = Model.define.page.width - paramSize.w;
                    $(".setStateDiv").css("left","-120px");
                }
                if(c.y + paramSize.h > Model.define.page.height){
                    c.y = Model.define.page.height - paramSize.h;
                }
                Designer.contextMenu.show(c.x, c.y);
            })
        },
        destroy: function () {
            $("#canvas_container").unbind("contextmenu");
            this.hide();
        },
        menuPos: {x: 0, y: 0, shape: null},
        show: function (i, h) {
            var c = $("#designer_contextmenu");
            var Event = {
                offsetX: i,
                offsetY: h
            }
            this.menuPos.x = i;
            this.menuPos.y = h;
            var a = Utils.getShapeByPosition(i, h, false, Event, void 0, Utils.getNotLockSelected()[0]);
            c.children().hide();
            var b = Designer.clipboard.elements.length;
            if (a == null) {
                if (b > 0) {
                    c.children("li[ac=paste]").show();
                }
            } else {
                var f = a.shape;
                this.menuPos.shape = f;
                if (f.locked) {
                    c.children("li[ac=unlock]").show();
                } else {
                    if (b > 0 && (f.name === "transverseline" || f.name === "longstring" )) {
                        c.children("li[ac=paste]").show()
                    }
                    if(f.name === "transverseline" || f.name === "longstring" ){
                        c.children("li[ac=copy]").show();
                    }
                    c.children("li[ac=front]").show();
                    c.children("li[ac=back]").show();
                    c.children("li[ac=lock]").show();
                    c.children("li[ac=delete]").show();
                    if(f.name === "addComputer"){
                        c.children("li[ac=setState]").show();
                    }
                }
            }
            c.children("li[ac=selectall]").show();
            if(h>Model.define.page.height- c.height()){
                h-=c.height();
            }
            c.css({display: "block", "z-index": Model.orderList.length + 3, left: i, top: h});
            $(document).bind("mousedown.ctxmenu", function () {
                Designer.contextMenu.hide();
            });
        },
        hide: function () {
            $("#designer_contextmenu").hide();
            $(".setStateDiv").hide();
            $(document).unbind("mousedown.ctxmenu");
        },
        execAction: function (a) {
            var b = a.attr("ac");
            if (b == "copy") {
                Designer.clipboard.copy();
            } else {
                if (b == "paste") {
                    Designer.clipboard.paste(this.menuPos.x, this.menuPos.y);
                } else {
                    if (b == "front") {
                        Designer.layerShapes("front");
                    } else {
                        if (b == "back") {
                            Designer.layerShapes("back");
                        } else {
                            if (b == "lock") {
                                Designer.lockShapes();
                            } else {
                                if (b == "unlock") {
                                    Designer.unlockShapes();
                                } else {
                                    if (b == "delete") {
                                        Designer.op.removeShape();
                                        cpWSetShow();
                                    } else {
                                        if (b == "selectall") {
                                            Designer.selectAll();
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    },
    init: function () {
        this.initialize.initLayout();
        this.initialize.initModel();
        if (localRuntime == false) {
            this.initialize.initCanvas()
        }
        this.initialize.initShapes();
        this.hotkey.init();
        this.contextMenu.init();
        Designer.op.init();
        this.initialize.initialized = true;
        Designer.events.push("initialized");
    },
    op: {
        init: function () {
            var b = $("#designer_canvas");
            var a = $("#canvas_container");
            a.unbind("mousemove.operate").bind("mousemove.operate", function (g) {
                Designer.op.destroy();
                var f = Utils.getRelativePos(g.pageX, g.pageY, b);
                var c = "", direction = $(".computer-top-nav").attr("data-direction");
                if(direction === "left") {
                    c = Utils.getShapeByPosition(f.x, f.y, undefined, g);
                }else if(direction === "right"){
                    c = Utils.getShapeByPosition(f.x, f.y, undefined, g, true);
                }
                if($(g.target).parents(".shape_box").length > 0){
                    c = {
                        type: "shape",
                        shape: Model.getShapeById($(g.target).parents(".shape_box").attr("id"))
                    }
                }
                if (c != null) {
                    if($(".computer-top-nav").attr("data-move") === "true") {
                        //组件样式选择框鼠标移入移出显示隐藏功能
                        if(!c.shape) return;
                        var nowid = c.shape.id;
                        if(!!nowid) {
                            clearTimeout(Model.setTimerOut);
                            if(!IS_SELECT) {
                                $(".computer-top-nav").attr({
                                    "data-id": nowid
                                }).show();
                            }
                            Designer.op.checkLocation();
                            if(!IS_SELECT){
                                if(Model.define.elements[nowid].name === 'transverseline' || Model.define.elements[nowid].name === 'longstring' || Model.define.elements[nowid].name === 'text' || Model.define.elements[nowid].name === 'arrow' || Model.define.elements[nowid].name === 'myPlace' || Model.define.elements[nowid].name === 'obstacle'){
                                    $(".component-color").show();
                                }else{
                                    $(".component-color").hide();
                                }
                                if(Model.define.elements[nowid].name === 'arrow' || Model.define.elements[nowid].name === 'myPlace' || Model.define.elements[nowid].name === 'obstacle' || Model.define.elements[nowid].name === 'mapTime'){
                                    $(".component-set").show();
                                }else{
                                    $(".component-set").hide();
                                }
                                if(Model.define.elements[nowid].name === 'text'){
                                    $(".component-setFontW").show();
                                    $(".component-setFontS").show();
                                    $(".component-setColor").show();
                                }else{
                                    $(".component-setFontW").hide();
                                    $(".component-setFontS").hide();
                                    $(".component-setColor").hide();
                                }
                                if( Model.define.elements[nowid].name === 'transverseline' || Model.define.elements[nowid].name === 'longstring'){
                                    $(".component-linewidth").show();
                                }else{
                                    $(".component-linewidth").hide();
                                }
                            }
                        }
                        Model.prevElementId = c.shape.id;
                    }
                    try{
                        if(!!$("#"+ c.shape.id).find(".shape_canvas").attr("data-title")){
                            
                            pageTitle.show($("#"+ c.shape.id).find(".shape_canvas").attr("data-title"), {
                                x: g.pageX - $('#canvas_container').offset().left + 30,
                                y: g.pageY - $('#canvas_container').offset().top + 30,
                                // x: $("#"+ c.shape.id)[0].offsetLeft + parseInt($("#"+ c.shape.id)[0].offsetTop/2),
                                // y: $("#"+ c.shape.id)[0].offsetTop + $("#"+ c.shape.id)[0].offsetHeight+10,
                            }, c.shape.id);
                        }
                    }catch (e){}
                    if (c.type == "shape") {
                        if (c.shape.locked) {
                            Designer.op.shapeSelectable(c.shape);
                        } else {
                            $(".computer-top-nav").attr("data-move", true);
                            Designer.op.shapeSelectable(c.shape);
                            Designer.op.shapeDraggable();
                        }
                    } else {
                        Designer.op.shapeSelectable(c.shape);
                        Designer.op.shapeDraggable();
                    }
                } else {
                    a.css("cursor", "default");
                    Designer.op.shapeMultiSelectable();
                    try{
                        pageTitle.hide();
                    }catch (e){}
                }
            })
        },
        cancel: function () {
            $("#canvas_container").unbind("mousemove.operate").css("cursor", "default");
            this.destroy();
        },
        destroy: function () {
            $("#designer_canvas").unbind("mousedown.drag").unbind("mousedown.select");
            $("#canvas_container").unbind("mousedown.drag_canvas");
            $("#designer_layout").unbind("mousedown.multiselect");
        },
        state: null,
        resetState: function () {
            this.state = null;
            $("#canvas_container").css("cursor", "default");
        },
        shapeSelectable: function (a) {
            var b = $("#designer_canvas");
            b.bind("mousedown.select", function (d) {
                if($(d.target).hasClass("computer-top-nav") || $(d.target).parents(".computer-top-nav").length > 0 || $(d.target).parents(".shape_box").length <= 0){
                    return;
                }
                var e = a.id;
                var nowid = a.id;
                if(!!nowid) {
                    IS_SELECT = true;
                    $(".computer-top-nav").css({
                        left: a.props.x - 38,
                        top: a.props.y
                    }).attr({
                        "data-id": a.id
                    }).show();
                    if(Model.define.elements[nowid].name === 'transverseline' || Model.define.elements[nowid].name === 'longstring' || Model.define.elements[nowid].name === 'text' || Model.define.elements[nowid].name === 'arrow' || Model.define.elements[nowid].name === 'myPlace' || Model.define.elements[nowid].name === 'obstacle'){
                        $(".component-color").show();
                    }else{
                        $(".component-color").hide();
                    }
                    if(Model.define.elements[nowid].name === 'mapTime' || Model.define.elements[nowid].name === 'arrow' || Model.define.elements[nowid].name === 'myPlace' || Model.define.elements[nowid].name === 'obstacle'){
                        $(".component-set").show();
                    }else{
                        $(".component-set").hide();
                    }
                    if(Model.define.elements[nowid].name === 'text'){
                        $(".component-setFontW").show();
                        $(".component-setFontS").show();
                        $(".component-setColor").show();
                    }else{
                        $(".component-setFontW").hide();
                        $(".component-setFontS").hide();
                        $(".component-setColor").hide();
                    }
                    if( Model.define.elements[nowid].name === 'transverseline' || Model.define.elements[nowid].name === 'longstring'){
                        $(".component-linewidth").show();
                    }else{
                        $(".component-linewidth").hide();
                    }
                }
                var c = [];
                if (d.ctrlKey) {
                    var c = Utils.getSelectedIds();
                    if (Utils.isSelected(e)) {
                        Utils.removeFromArray(c, e);
                    } else {
                        c.push(e);
                    }
                    Utils.unselect();
                    if (c.length > 0) {
                        Utils.selectShape(c);
                    }
                } else {
                    if (Utils.selectIds.indexOf(e) < 0) {
                        Utils.unselect();
                        Utils.selectShape(e);
                    }
                }
                $(document).bind("mouseup.select", function () {
                    Designer.op.resetState();
                    b.unbind("mousedown.select");
                    $(document).unbind("mouseup.select");
                })
            })
        },
        shapeDraggable: function () {
            var b = $("#designer_canvas");
            var a = $("#canvas_container");
            b.bind("mousedown.drag", function (r) {
                var j = Utils.getSelected();
                var direction = Designer.op.checkLocation(j[0]);//快捷皱建位置
                if(j.length === 1){
                    NOWEL = JSON.parse(JSON.stringify(j[0]));
                }
                //只有点击到组件左侧导航条的时候才进行移动，否则不移动
                var f = Utils.getRelativePos(r.pageX, r.pageY, b);
                var g = true;
                var d = null;
                if (g) {
                    d = Utils.getShapesBounding(j);
                }
                var q = Utils.getFamilyShapes(j);
                j = j.concat(q);
                var n = Utils.getContainedShapes(j);
                j = j.concat(n);
                var e = [];
                if (g) {
                    for (var l = 0; l < j.length; l++) {
                        var o = j[l];
                        if (e.indexOf(o.id) < 0) {
                            e.push(o.id)
                        }
                    }
                }
                var h = j;
                if (j.length == 0) {
                    b.unbind("mousedown.drag");
                    return
                }
                a.bind("mousemove.drag", function (w) {
                    if (OPERATION) {
                        return;
                    }
                    pageTitle.hide();
                    if (Model.setTimerOut) {
                        clearTimeout(Model.setTimerOut);
                    }
                    // UI.hideShapeOptions();
                    // console.log(w);
                    var v = Utils.getRelativePos(w.pageX, w.pageY, b, true);
                    var y = {x: v.x - f.x, y: v.y - f.y};
                    var i = null;
                    var dragParentEl = $("#shape_controls");
                    // console.log(dragParentEl);
                    var dragElObj = {
                        w: parseInt(dragParentEl.attr("data-width")),
                        h: parseInt(dragParentEl.attr("data-height")),
                        x: parseInt(dragParentEl.css("left")),
                        y: parseInt(dragParentEl.css("top"))
                    }
                    // if(dragElObj.y.toScale() - 56 < 0){
                    //     $(".top-align-list2").css({left: dragElObj.x.toScale()-5, top: dragElObj.h+56});
                    // }else if(dragElObj.x.toScale() + 310 > Model.define.page.width ){
                    //     $(".top-align-list2").css({left: dragElObj.x.toScale()- 310, top: dragElObj.y.toScale()-56});
                    // }else{
                    //     $(".top-align-list2").css({left: dragElObj.x.toScale()-5, top: dragElObj.y.toScale()-56});
                    // }
                    if (g) {
                        var z = Utils.copy(d);
                        z.x += y.x;
                        z.y += y.y;
                        var x = Designer.op.snapLine(z, e);
                        y = {x: z.x - d.x, y: z.y - d.y};
                        v = {x: f.x + y.x, y: f.y + y.y};
                        d.x += y.x;
                        d.y += y.y;
                        if (h.length == 1 && h[0].groupName == "boundaryEvent") {
                            if (x.attach) {
                                h[0].attachTo = x.attach.id
                            } else {
                                delete j[0].attachTo
                            }
                        }
                        if (x.container) {
                            i = x.container
                        }
                    }

                    $("#bar_redo").addClass("disabled");

                    for (var u = 0; u < j.length; u++) {
                        var t = j[u];
                        if (t.container && c.indexOf(t.container) >= 0) {
                            continue;
                        }
                        if (i) {
                            t.container = i.id
                        } else {
                            delete t.container
                        }
                    }
                    if (direction === "left") {
                        // if(j[0].props.y>Model.define.page.height-$(".computer-top-nav").height()){
                        //     $(".computer-top-nav").css({
                        //         left: j[0].props.x - 38,
                        //         top: j[0].props.y-$(".computer-top-nav").height()
                        //     });
                        // }else {
                        //     $(".computer-top-nav").css({
                        //         left: j[0].props.x - 38,
                        //         top: j[0].props.y
                        //     });
                        // }
                        $(".computer-top-nav").css({
                            left: j[0].props.x - 28,
                            top: j[0].props.y
                        });
                    } else {
                        // if(j[0].props.y>Model.define.page.height-$(".computer-top-nav").height()){
                        //     $(".computer-top-nav").css({
                        //         left: j[0].props.w + j[0].props.x ,
                        //         top: j[0].props.y-$(".computer-top-nav").height()
                        //     });
                        // }else {
                        //     $(".computer-top-nav").css({
                        //         left: j[0].props.w + j[0].props.x ,
                        //         top: j[0].props.y
                        //     });
                        // }
                        $(".computer-top-nav").css({
                            left: j[0].props.w + j[0].props.x + 6,
                            top: j[0].props.y
                        });

                    }
                    // if ((j[0].props.h + j[0].props.y + y.y) >= Model.define.page.height) {
                    //     y.y = Model.define.page.height - (j[0].props.h + j[0].props.y) - 1;
                    // } else if ((j[0].props.y + y.y) <= 0) {
                    //     y.y = 0 - (j[0].props.y + y.y);
                    // }
                    // if ((j[0].props.w + j[0].props.x + y.x) >= Model.define.page.width) {
                    //     y.x = Model.define.page.width - (j[0].props.w + j[0].props.x) - 1
                    // } else if ((j[0].props.x + y.x) <= 0) {
                    //     y.x = 0 - (j[0].props.x + y.x);
                    // }
                    if ((j[0].props.h + j[0].props.y + y.y) >= $('#canvas_container').height()) {
                        y.y = $('#canvas_container').height() - (j[0].props.h + j[0].props.y) - 1;
                    } else if ((j[0].props.y + y.y) <= 0) {
                        y.y = 0 - (j[0].props.y + y.y);
                    }
                    if ((j[0].props.w + j[0].props.x + y.x) >= $('#canvas_container').width()) {
                        y.x = $('#canvas_container').width() - (j[0].props.w + j[0].props.x) - 1
                    } else if ((j[0].props.x + y.x) <= 0) {
                        y.x = 0 - (j[0].props.x + y.x);
                    }
                    if(dragElObj.y + y.y < 0){
                        y.y = 0;
                    }
                    if(dragElObj.x + y.x < 0){
                        y.x = 0;
                    }
                    if(dragElObj.w + dragElObj.x + y.x > Model.define.page.width-2){
                        y.x = 0;
                    }
                    if(dragElObj.h + dragElObj.y + y.y > Model.define.page.height-1){
                        y.y = 0;
                    }
                    Designer.op.moveShape(j, y);
                    if(j.length === 1){
                        resizeToolbar(Model.define.elements[j[0].id].props);
                        resizeCPNum(Model.define.elements[j[0].id].componentsObj.computerNum);
                    }
                    f = v;
                    $(document).unbind("mouseup.drop").bind("mouseup.drop", function () {
                        $(document).unbind("mouseup.drop");
                        if(!!NOWEL && j.length === 1){
                            var f = {shapes: [JSON.parse(JSON.stringify(NOWEL))], updates: [JSON.parse(JSON.stringify(j[0]))]};
                            MessageSource.send("update", f);
                            NOWEL = "";
                            Model.updateMulti(j, false, true);
                            return;
                        }
                        Model.updateMulti(j);
                    })
                });
                $(document).bind("mouseup.drag", function () {
                    Designer.op.checkLocation(Utils.getSelected()[0]);
                    Designer.op.resetState();
                    Designer.op.hideSnapLine();
                    a.unbind("mousemove.drag");
                    b.unbind("mousedown.drag");
                    $(document).unbind("mouseup.drag");
                });
            });
        },
        shapeResizable: function () {
            $(".shape_controller").bind("mousedown", function (c) {
                // cp_width=$(" .sliderBf" ).slider("value");
                c.stopPropagation();
                var j = Utils.getSelectedIds(),
                    r = Utils.getSelected(),
                    nowele = Utils.getSelected(),
                    scale = {
                        wscale: nowele[0].props.w,
                        hscale: nowele[0].props.h,
                        w: nowele[0].props.w,
                        h: nowele[0].props.h
                    },
                    temp;
                if(scale.w > scale.h){
                    temp = scale.w;
                    scale.wscale = 1;
                    scale.hscale = scale.h / temp;
                }else if(scale.w < scale.h){
                    temp = scale.h;
                    scale.hscale = 1;
                    scale.wscale = scale.w / temp;
                }else if(scale.w === scale.h){
                    scale.wscale = 1;
                    scale.hscale = 1;
                }
                if(r.length === 1){
                    if(Model.define.elements[j].name === "addComputer" || Model.define.elements[j].name === "mapTime"){
                       return ;
                    }
                    NOWEL = JSON.parse(JSON.stringify(r[0]));
                }
                var l = $("#canvas_container");
                var f = $("#designer_canvas");
                var n = $(this);
                var q;
                if (j.length == 1) {
                    var d = Model.getShapeById(j[0]);
                    q = Utils.copy(d.props);
                } else {
                    q = Utils.getControlBox(j);
                    q.angle = 0;
                }
                var z = {x: q.x + q.w / 2, y: q.y + q.h / 2};
                var A = n.attr("resizeDir");
                var y = {};
                if (A.indexOf("l") >= 0) {
                    y.x = q.x + q.w;
                } else {
                    if (A.indexOf("r") >= 0) {
                        y.x = q.x
                    } else {
                        y.x = q.x + q.w / 2
                    }
                }
                if (A.indexOf("t") >= 0) {
                    y.y = q.y + q.h
                } else {
                    if (A.indexOf("b") >= 0) {
                        y.y = q.y
                    } else {
                        y.y = q.y + q.h / 2
                    }
                }
                y = Utils.getRotated(z, y, q.angle);
                var h = [];
                var b = {};
                var s = [];
                for (var u = 0; u < r.length; u++) {
                    var d = r[u];
                    s.push(d.id);
                    if (d.parent) {
                        s.push(d.parent);
                    }
                    h.push(d);
                    b[d.id] = {
                        x: (d.props.x - q.x) / q.w,
                        y: (d.props.y - q.y) / q.h,
                        w: d.props.w / q.w,
                        h: d.props.h / q.h
                    }
                }
                var g = n.css("cursor");
                l.css("cursor", g);
                var x = [];
                var a = {w: MINSIZE.width, h: MINSIZE.height};
                l.bind("mousemove.resize", function (X) {
                    if (Utils.selectIds.length === 1) {
                        $("#bar_redo").addClass("disabled");
                        x = [];
                        var G = Utils.getRelativePos(X.pageX, X.pageY, f);
                        G = Utils.restoreScale(G);
                        var O = Utils.getRotated(y, G, -q.angle);
                        var D = Utils.copy(q);
                        var nowsel = Utils.getSelected();
                        var isvertical = false,
                            componentHeight = 0;
                        if (nowsel.length === 1) {
                            nowsel = nowsel[0];
                        }
                        if (!(nowsel instanceof Array)) {
                            isvertical = $("#" + nowsel.id).find(".shape_canvas").attr("data-nodrag") === "vertical" ? true : false;
                            if (isvertical) {
                                componentHeight = $("#" + nowsel.id).find(".shape_canvas").attr("data-height");
                            }
                        }
                        if (A.indexOf("r") >= 0) {
                            if (nowele[0].name != "longstring") {
                                D.w = O.x - y.x
                            }
                        } else {
                            if (A.indexOf("l") >= 0) {
                                if (nowele[0].name != "longstring") {
                                    D.w = y.x - O.x
                                }
                            }
                        }
                        if (A.indexOf("b") >= 0) {
                            if (nowele[0].name != "transverseline") {
                                D.h = O.y - y.y
                            }
                        } else {
                            if (A.indexOf("t") >= 0) {
                                if (nowele[0].name != "transverseline") {
                                    D.h = y.y - O.y
                                }
                            }
                        }
                        if (X.ctrlKey && A.length == 2) {
                            if (q.w >= q.h) {
                                D.h = q.h / q.w * D.w;
                                if (D.h < a.h) {
                                    if (nowele[0].name != "transverseline") {
                                        D.h = a.h;
                                    }
                                    if (nowele[0].name != "longstring") {
                                        D.w = q.w / q.h * D.h
                                    }
                                }
                            } else {
                                D.w = q.w / q.h * D.h;
                                if (D.w < a.w) {
                                    if (nowele[0].name != "longstring") {
                                        D.w = a.w;
                                    }
                                    if (nowele[0].name != "transverseline") {
                                        D.h = q.h / q.w * D.w
                                    }
                                }
                            }
                        } else {
                            if (D.w < a.w) {
                                if (nowele[0].name != "longstring") {
                                    D.w = a.w
                                }
                            }
                            if (D.h < a.h) {
                                if (nowele[0].name != "transverseline") {
                                    D.h = a.h
                                }
                            }
                        }
                        if(nowele[0].name === "arrow" || nowele[0].name === "obstacle" || nowele[0].name === "myPlace"){
                            if (q.w >= q.h) {
                                D.h = q.h / q.w * D.w;
                                if (D.h < a.h) {
                                    D.h = a.h;
                                    D.w = q.w / q.h * D.h;
                                }
                            } else {
                                D.w = q.w / q.h * D.h;
                                if (D.w < a.w) {
                                    D.w = a.w;
                                    D.h = q.h / q.w * D.w;
                                }
                            }
                        }
                        var U = {};
                        if (A.indexOf("r") >= 0) {
                            U.x = y.x + D.w
                        } else {
                            if (A.indexOf("l") >= 0) {
                                U.x = y.x - D.w
                            } else {
                                U.x = y.x
                            }
                        }
                        if (A.indexOf("b") >= 0) {
                            U.y = y.y + D.h
                        } else {
                            if (A.indexOf("t") >= 0) {
                                U.y = y.y - D.h
                            } else {
                                U.y = y.y
                            }
                        }
                        var K = Utils.getRotated(y, U, q.angle);
                        var M = {x: 0.5 * y.x + 0.5 * K.x, y: 0.5 * y.y + 0.5 * K.y};
                        var S = Utils.getRotated(M, y, -q.angle);
                        if (A.indexOf("r") >= 0) {
                            D.x = S.x
                        } else {
                            if (A.indexOf("l") >= 0) {
                                D.x = S.x - D.w
                            } else {
                                D.x = S.x - D.w / 2
                            }
                        }
                        if (A.indexOf("b") >= 0) {
                            D.y = S.y
                        } else {
                            if (A.indexOf("t") >= 0) {
                                D.y = S.y - D.h
                            } else {
                                D.y = S.y - D.h / 2
                            }
                        }

                        var counta = 1;
                        if(D.w / scale.w > D.h / scale.h){
                            counta = D.w / scale.w
                        }else{
                            counta = D.h / scale.h
                        }
                        if(X.shiftKey){
                            D.w = counta * scale.w;
                            D.h = counta * scale.h;
                        }

                        if (isvertical) {
                            D.h = componentHeight;
                        }

                        for (var T = 0; T < h.length; T++) {
                            var F = h[T];
                            var P = b[F.id];
                            if (P.type == "attached") {
                                F.props.x = D.x + D.w * P.x - F.props.w / 2;
                                F.props.y = D.y + D.h * P.y - F.props.h / 2
                            } else {
                                var C = Utils.copy(F.props);
                                F.props.x = D.x + D.w * P.x;
                                F.props.y = D.y + D.h * P.y;
                                F.props.w = D.w * P.w;
                                F.props.h = D.h * P.h;
                                var E = Model.getShapeById(F.id).props;
                                E.x = D.x + D.w * P.x;
                                E.y = D.y + D.h * P.y;
                                E.w = D.w * P.w;
                                E.h = D.h * P.h;
                                var J = {
                                    x: F.props.x - C.x,
                                    y: F.props.y - C.y,
                                    w: F.props.w - C.w,
                                    h: F.props.h - C.h
                                };
                            }
                            Designer.painter.renderShape(F);
                            var direction = Designer.op.checkLocation(F);
                            resizeToolbar(F.props);
                        }
                        var tsnowel = Model.define.elements[Utils.selectIds[0]];
                        if (tsnowel.props.h + tsnowel.props.y  > Model.define.page.height) {
                            $("#" + tsnowel.id).css("height", Model.define.page.height - tsnowel.props.y);
                            tsnowel.props.h = Model.define.page.height  - tsnowel.props.y;
                            Utils.unselect();
                            Utils.selectShape([tsnowel.id]);
                        } else {
                            Designer.painter.drawControls(j);
                            $(document).unbind("mouseup.resize_ok").bind("mouseup.resize_ok", function () {
                                if (x.length > 0) {
                                    h = h.concat(x);
                                }
                                if (A.indexOf("t") >= 0 || A.indexOf("l") >= 0) {
                                    for (var aa = 0; aa < h.length; aa++) {
                                        var Z = h[aa];
                                        if (Z.attribute && Z.attribute.collapsed) {
                                            var ac = Utils.getCollapsedShapesById(Z.id);
                                            if (ac.length > 0) {
                                                var Y = Model.getPersistenceById(Z.id);
                                                var i = Z.props.x - Y.props.x;
                                                var ad = Z.props.y - Y.props.y;
                                                Designer.op.moveShape(ac, {x: i, y: ad}, true);
                                                h = h.concat(ac);
                                            }
                                        }
                                    }
                                    Designer.painter.drawControls(j);
                                }
                                if (!!NOWEL) {
                                    var f = {
                                        shapes: [JSON.parse(JSON.stringify(NOWEL))],
                                        updates: [JSON.parse(JSON.stringify(h[0]))]
                                    };
                                    MessageSource.send("update", f);
                                    NOWEL = "";
                                    Model.updateMulti(h, true, true);
                                    $(document).unbind("mouseup.resize_ok");
                                    return;
                                }
                                Model.updateMulti(h, true);
                                $(document).unbind("mouseup.resize_ok");
                            })
                        }
                    }
                });
                $(document).bind("mouseup.resize", function () {
                    l.css("cursor", "default");
                    Designer.op.resetState();
                    l.unbind("mousemove.resize");
                    $(document).unbind("mouseup.resize");
                })
            })
        },
        shapeRotatable: function () {
            $(".shape_rotater").bind("mousemove", function (d) {
                var c = $(this);
                var b = d.target.nodeName;
                c.removeClass("rotate_enable");
                if (b) {
                    c.addClass("rotate_enable");
                    $(".computer-top-nav").hide();
                    c.bind("mousedown", function (p) {
                        // cp_width=$(" .sliderBf" ).slider("value");
                        c.unbind("mousedown");
                        p.stopPropagation();
                        var l = Utils.getSelectedIds();
                        var o;
                        var k;
                        if (l.length == 1) {
                            var m = Model.getShapeById(l[0]);
                            o = m.props;
                            k = m.props.angle
                        } else {
                            o = Utils.getControlBox(l);
                            k = 0
                        }
                        var e = {x: o.x + o.w / 2, y: o.y + o.h / 2};
                        var n = Utils.toScale(e);
                        var g = $("#designer_canvas");
                        var i = Utils.getSelected();
                        var h = k;
                        $(document).bind("mousemove.rotate", function (r) {
                            var C = Utils.getRelativePos(r.pageX, r.pageY, g);
                            var v = Math.atan(Math.abs(C.x - n.x) / Math.abs(n.y - C.y));
                            if (C.x >= n.x && C.y >= n.y) {
                                v = Math.PI - v
                            } else {
                                if (C.x <= n.x && C.y >= n.y) {
                                    v = Math.PI + v
                                } else {
                                    if (C.x <= n.x && C.y <= n.y) {
                                        v = Math.PI * 2 - v
                                    }
                                }
                            }
                            v = v % (Math.PI * 2);
                            var D = Math.PI / 36;
                            var A = Math.round(v / D);
                            v = D * A;
                            if (v == h) {
                                return
                            }
                            h = v;
                            Designer.painter.rotateControls(o, v);
                            var E = v - k;
                            for (var w = 0; w < i.length; w++) {
                                var y = i[w];
                                var u = Model.getPersistenceById(y.id);
                                y.props.angle = Math.abs((E + u.props.angle) % (Math.PI * 2));
                                var deg=y.props.angle;
                                $("#"+ y.id).css({
                                    "-ms-transform":" rotate("+ deg*180/Math.PI +"deg)",
                                    "-moz-transform":" rotate("+ deg*180/Math.PI +"deg)",
                                    "-webkit-transform":" rotate("+ deg*180/Math.PI +"deg)",
                                    "-o-transform":" rotate("+ deg*180/Math.PI +"deg)",
                                    "transform":" rotate("+ deg*180/Math.PI +"deg)"
                                });
                                var x = {x: u.props.x + u.props.w / 2, y: u.props.y + u.props.h / 2};
                                var B = Utils.getRotated(e, x, E);
                                y.props.x = B.x - y.props.w / 2;
                                y.props.y = B.y - y.props.h / 2;
                                Designer.painter.renderShape(y);
                            }
                            $(document).unbind("mouseup.rotate").bind("mouseup.rotate", function () {
                                $(document).unbind("mousemove.rotate").unbind("mouseup.rotate");
                                if(!!NOWEL && i.length === 1){
                                    var f = {shapes: [JSON.parse(JSON.stringify(NOWEL))], updates: [JSON.parse(JSON.stringify(i[0]))]};
                                    MessageSource.send("update", f);
                                    NOWEL = "";
                                    Model.updateMulti(i, false, true);
                                    return;
                                }
                                Model.updateMulti(i);
                            })
                        }).bind("mouseup.rotate", function () {
                            $(document).unbind("mousemove.rotate").unbind("mouseup.rotate");
                            Designer.op.resetState();
                            Model.updateMulti(i);
                            Designer.painter.drawControls(l);
                        })
                    })
                } else {
                    c.removeClass("rotate_enable");
                    c.unbind("mousedown");
                }
            })
        },
        groupShapeChangable: function () {
            $(".change_shape_icon").bind("mousedown", function (f) {
                f.stopPropagation();
                var a = Utils.getSelected()[0];
                var h = a.groupName;
                var d = $(this).parent();
                var g = d.position();
                var c = g.left + d.width();
                var b = g.top + d.height() + 10;
                Designer.op.groupDashboard(h, c, b, function (e) {
                    if (a.name != e) {
                        var i = Designer.events.push("shapeChanged", {shape: a, name: e});
                        Model.changeShape(a, e);
                        var j = [a];
                        if (i && i.length > 0) {
                            j = j.concat(i);
                        }
                        Model.updateMulti(j);
                    }
                })
            })
        },
        shapeMultiSelectable: function () {
            var a = $("#designer_canvas");
            var b = $("#designer_layout");
            b.unbind("mousedown.multiselect").bind("mousedown.multiselect", function (e) {
                var etarget = $(e.target);
                if(etarget.parents(".top-align-list2").length > 0 || etarget.hasClass(".top-align-list2")){
                    return;
                }
                if(IS_SELECT) {
                    if(etarget.parents(".computer-top-nav").length > 0 || etarget.hasClass(".computer-top-nav") || etarget.parents(".line_width_list2").length > 0 || etarget.hasClass(".line_width_list2")){

                    }else{
                        $(".computer-top-nav").hide();
                        $(".line_width_list2").hide();
                    }
                }
                var d = null;
                if (!e.ctrlKey) {
                    IS_SELECT = false;
                    Utils.unselect();
                }
                var c = Utils.getRelativePos(e.pageX, e.pageY, a);
                b.bind("mousemove.multiselect", function (g) {
                    if(OPERATION){
                        return;
                    }
                    if (d == null) {
                        d = $("<div id='selecting_box'></div>").appendTo(a);
                    }
                    var f = Utils.getRelativePos(g.pageX, g.pageY, a);
                    var h = {"z-index": Model.orderList.length, left: f.x, top: f.y};
                    if (f.x > c.x) {
                        h.left = c.x;
                    }
                    if (f.y > c.y) {
                        h.top = c.y;
                    }
                    h.width = Math.abs(f.x - c.x);
                    h.height = Math.abs(f.y - c.y);
                    d.css(h);
                });
                $(document).unbind("mouseup.multiselect").bind("mouseup.multiselect", function (h) {
                    if (d != null) {
                        var f = {
                            x: d.position().left.restoreScale(),
                            y: d.position().top.restoreScale(),
                            w: d.width().restoreScale(),
                            h: d.height().restoreScale()
                        };
                        var i = Utils.getShapesByRange(f);
                        if (h.ctrlKey) {
                            var g = Utils.getSelectedIds();
                            Utils.mergeArray(i, g)
                        }
                        Utils.unselect();
                        Utils.selectShape(i);
                        d.remove();
                    }
                    Designer.op.resetState();
                    $(document).unbind("mouseup.multiselect");
                    b.unbind("mousemove.multiselect")
                });
                b.unbind("mousedown.multiselect")
            })
        },
        canvasDragTimeout: null,
        moveShape: function (q, h, c) {
            var r = [];
            for (var t = 0; t < q.length; t++) {
                var b = q[t];
                r.push(b.id);
            }
            IS_EXIT_SAVE = false;
            var w = Utils.restoreScale(h);
            for (var t = 0; t < q.length; t++) {
                var b = q[t];
                if(a(b)){
                    $(".shape_contour[forshape=" + b.id + "]").css({
                        left: b.props.x.toScale(),
                        top: b.props.y.toScale()
                    });
                }
            }
            if (typeof c == "undefined") {
                var l = $("#shape_controls");
                if(parseFloat(l.css("left")) + h.x < 0 || parseFloat(l.css("top")) + h.y < 0 || parseFloat(l.css("left")) + h.x + parseInt(l.attr("data-width")) >= Model.define.page.width || parseFloat(l.css("top")) + h.y + parseInt(l.attr("data-height")) >= Model.define.page.height){
                    return ;
                }else{
                    l.css({left: parseFloat(l.css("left")) + h.x, top: parseFloat(l.css("top")) + h.y});
                }
            }
            function a(i) {
                i.props.x += w.x;
                i.props.y += w.y;
                var p = $("#" + i.id);
                p.css({left: parseFloat(p.css("left")) + h.x, top: parseFloat(p.css("top")) + h.y});
                return true;
            }
        },
        removeShape: function (el) {
            var d = Utils.getNotLockSelected();
            if(d.length === 0 && !!el){
                d = [el];
            }
            $(".computer-top-nav").hide();
            if (d.length > 0) {
                Utils.unselect();
                var c = [];
                for (var b = 0; b < d.length; b++) {
                    var a = Utils.getChildrenShapes(d[b]),
                        nowscript = d[b],
                        isdel = false;

                    for(var i in Model.define.elements){
                        var eldata = Model.define.elements[i];
                        if(eldata.componenturl === nowscript.componenturl && nowscript.id !== eldata.id){
                            break;
                        }else{
                            isdel = true;
                        }
                    }
                    if(isdel){
                        !!ALLSCRIPT[nowscript.componenturl] && delete ALLSCRIPT[nowscript.componenturl];
                        !!TEMPLATEAPI[nowscript.componenturl] && delete TEMPLATEAPI[nowscript.componenturl];
                    }

                    c = c.concat(a)
                }
                d = d.concat(c);
                Model.remove(d);
                $("#bar_redo").addClass("disabled");
                $(".computer-top-nav").hide();
                IS_SELECT = false;
            }
        },
        checkLocation: function() {
            var obj = Model.define.elements[$(".computer-top-nav").attr("data-id")];
            if(!obj){
                return;
            }
            if(!!obj && (obj.name === 'transverseline' || obj.name === 'longstring' || obj.name === 'text' || obj.name === 'arrow' || obj.name === 'myPlace' ||obj.name === 'obstacle')){
                $(".component-color").show();
            }else{
                $(".component-color").hide();
            }
            if(!!obj && (obj.name === 'arrow' || obj.name === 'myPlace' || obj.name === 'obstacle' || obj.name === 'mapTime')){
                $(".component-set").show();
            }else{
                $(".component-set").hide();
            }
            if(!!obj && obj.name === 'text'){
                $(".component-setFontW").show();
                $(".component-setFontS").show();
                $(".component-setColor").show();
            }else{
                $(".component-setFontW").hide();
                $(".component-setFontS").hide();
                $(".component-setColor").hide();
            }
            if( obj.name === 'transverseline' || obj.name === 'longstring'){
                $(".component-linewidth").show();
            }else{
                $(".component-linewidth").hide();
            }
            if(!!obj && !!obj.props && !!obj.props.x && obj.props.x < 30) {
                if(obj.props.y>Model.define.page.height-$(".computer-top-nav").height()){
                    $(".computer-top-nav").css({
                        left: obj.props.w + obj.props.x + 6,
                        top: obj.props.y-$(".computer-top-nav").height()
                    }).attr({
                        "data-direction": "right",
                        "data-id": obj.id
                    })
                }else {
                    $(".computer-top-nav").css({
                        left: obj.props.w + obj.props.x + 6,
                        top: obj.props.y
                    }).attr({
                        "data-direction": "right",
                        "data-id": obj.id
                    })
                }
                return "right"
            }else{
                if(obj.props.y>Model.define.page.height-$(".computer-top-nav").height()){
                    $(".computer-top-nav").css({
                        left : obj.props.x - 38,
                        top : obj.props.y-$(".computer-top-nav").height()
                    }).attr({
                        "data-direction": "left",
                        "data-id": obj.id
                    });
                }else {
                    $(".computer-top-nav").css({
                        left : obj.props.x - 38,
                        top : obj.props.y
                    }).attr({
                        "data-direction": "left",
                        "data-id": obj.id
                    })
                }
                return "left";
            }
        },
        snapLine: function (t, u, E, j) {
            var s = t.y;
            var I = t.y + t.h / 2;
            var k = t.y + t.h;
            var g = t.x;
            var D = t.x + t.w / 2;
            var B = t.x + t.w;
            var f = 2;
            var m = {v: null, h: null, attach: null, container: null};
            var C = null;
            if (E) {
                C = j
            } else {
                C = Model.getShapeById(u[0]);
            }
            if (u.length == 1 && !!C && C.groupName == "boundaryEvent") {
                for (var x = Model.orderList.length - 1; x >= 0; x--) {
                    var F = Model.orderList[x].id;
                    var d = Model.getShapeById(F);
                    if (d.attribute && d.attribute.collapseBy) {
                        continue
                    }
                    if (d.name != "linker" && d.id != C.id) {
                        var v = d.props;
                        if (m.attach == null && v.angle == 0 && (d.groupName == "task" || d.groupName == "callActivity" || d.groupName == "subProcess")) {
                            var z = {x: v.x - f, y: v.y - f, w: v.w + f * 2, h: v.h + f * 2};
                            if (Utils.pointInRect(D, I, z)) {
                                var c = v.y;
                                var l = v.y + v.h;
                                var H = v.x;
                                var w = v.x + v.w;
                                var r = false;
                                var n = false;
                                if (c >= I - f && c <= I + f) {
                                    t.y = c - t.h / 2;
                                    n = true
                                } else {
                                    if (l >= I - f && l <= I + f) {
                                        t.y = l - t.h / 2;
                                        n = true
                                    }
                                }
                                if (H >= D - f && H <= D + f) {
                                    t.x = H - t.w / 2;
                                    r = true
                                } else {
                                    if (w >= D - f && w <= D + f) {
                                        t.x = w - t.w / 2;
                                        r = true
                                    }
                                }
                                if (r || n) {
                                    m.attach = d
                                }
                            }
                        }
                    }
                }
            }
            if (m.attach == null) {
                for (var x = Model.orderList.length - 1; x >= 0; x--) {
                    var F = Model.orderList[x].id;
                    var d = Model.getShapeById(F);
                    if (d.attribute && d.attribute.collapseBy) {
                        continue
                    }
                    if (d.name == "linker" || u.indexOf(F) >= 0 || d.parent) {
                        continue
                    }
                    var v = d.props;
                    if (m.h == null) {
                        var c = v.y;
                        var b = v.y + v.h / 2;
                        var l = v.y + v.h;
                        if (b >= I - f && b <= I + f) {
                            m.h = {type: "middle", y: b};
                            t.y = b - t.h / 2
                        } else {
                            if (c >= s - f && c <= s + f) {
                                m.h = {type: "top", y: c};
                                t.y = c
                            } else {
                                if (l >= k - f && l <= k + f) {
                                    m.h = {type: "bottom", y: l};
                                    t.y = l - t.h
                                } else {
                                    if (l >= s - f && l <= s + f) {
                                        m.h = {type: "top", y: l};
                                        t.y = l
                                    } else {
                                        if (c >= k - f && c <= k + f) {
                                            m.h = {type: "bottom", y: c};
                                            t.y = c - t.h
                                        }
                                    }
                                }
                            }
                        }
                    }
                    if (m.v == null) {
                        var H = v.x;
                        var G = v.x + v.w / 2;
                        var w = v.x + v.w;
                        if (G >= D - f && G <= D + f) {
                            m.v = {type: "center", x: G};
                            t.x = G - t.w / 2
                        } else {
                            if (H >= g - f && H <= g + f) {
                                m.v = {type: "left", x: H};
                                t.x = H
                            } else {
                                if (w >= B - f && w <= B + f) {
                                    m.v = {type: "right", x: w};
                                    t.x = w - t.w
                                } else {
                                    if (w >= g - f && w <= g + f) {
                                        m.v = {type: "left", x: w};
                                        t.x = w
                                    } else {
                                        if (H >= B - f && H <= B + f) {
                                            m.v = {type: "right", x: H};
                                            t.x = H - t.w
                                        }
                                    }
                                }
                            }
                        }
                    }
                    if (m.container == null) {
                        if (d.attribute && d.attribute.container) {
                            if (Utils.rectInRect(t, d.props)) {
                                m.container = d
                            }
                        }
                    }
                    if (m.h != null && m.v != null && m.container != null) {
                        break
                    }
                }
            }
            this.hideSnapLine();
            var e = $("#canvas_container");
            if (m.attach != null || m.container != null) {
                var q = $("#designer_op_snapline_attach");
                if (q.length == 0) {
                    q = $("<div id='designer_op_snapline_attach'></div>").appendTo(e)
                }
                var y = m.attach || m.container;
                var h = Utils.getShapeLineStyle(y.lineStyle);
                var a = h.lineWidth;
                q.css({
                    width: (y.props.w + a).toScale(),
                    height: (y.props.h + a).toScale(),
                    left: (y.props.x - a / 2).toScale() - 2,
                    top: (y.props.y - a / 2).toScale() - 2,
                    "z-index": $("#" + y.id).css("z-index")
                }).show()
            }
            if (m.h != null) {
                var A = $("#designer_op_snapline_h");
                if (A.length == 0) {
                    A = $("<div id='designer_op_snapline_h'></div>").appendTo(e);
                }
                A.css({
                    width: e.width() + Designer.config.pageMargin * 2,
                    left: -Designer.config.pageMargin,
                    top: Math.round(m.h.y.toScale()),
                    "z-index": Model.orderList.length + 1
                }).show();
            }
            if (m.v != null) {
                var o = $("#designer_op_snapline_v");
                if (o.length == 0) {
                    o = $("<div id='designer_op_snapline_v'></div>").appendTo(e)
                }

                o.css({
                    height: Model.define.page.height,
                    top: -Designer.config.pageMargin,
                    left: Math.round(m.v.x.toScale()),
                    "z-index": Model.orderList.length + 1
                }).show()
            }
            return m
        },
        snapLinkerLine: function (o, m) {
            var q = {v: null, h: null};
            var k = 2;
            for (var h = Model.orderList.length - 1; h >= 0; h--) {
                var n = Model.orderList[h].id;
                var l = Model.getShapeById(n);
                if (l.attribute && l.attribute.collapseBy) {
                    continue
                }
                if (l.name == "linker" || l.parent) {
                    continue
                }
                var f = l.props;
                if (q.h == null) {
                    var d = f.y;
                    var j = f.y + f.h;
                    if (d >= m - k && d <= m + k) {
                        q.h = d
                    } else {
                        if (j >= m - k && j <= m + k) {
                            q.h = j
                        }
                    }
                }
                if (q.v == null) {
                    var p = f.x;
                    var e = f.x + f.w;
                    if (p >= o - k && p <= o + k) {
                        q.v = p
                    } else {
                        if (e >= o - k && e <= o + k) {
                            q.v = e
                        }
                    }
                }
                if (q.h != null && q.v != null) {
                    break
                }
            }
            this.hideSnapLine();
            var c = $("#designer_canvas");
            if (q.h != null) {
                var g = $("#designer_op_snapline_h");
                if (g.length == 0) {
                    g = $("<div id='designer_op_snapline_h'></div>").appendTo(c)
                }
                g.css({
                    width: c.width() + Designer.config.pageMargin * 2,
                    left: -Designer.config.pageMargin,
                    top: Math.round(q.h.toScale()),
                    "z-index": Model.orderList.length + 1
                }).show()
            }
            if (q.v != null) {
                var a = $("#designer_op_snapline_v");
                if (a.length == 0) {
                    a = $("<div id='designer_op_snapline_v'></div>").appendTo(c)
                }
                a.css({
                    height: Model.define.page.height,
                    top: -Designer.config.pageMargin,
                    left: Math.round(q.v.toScale()),
                    "z-index": Model.orderList.length + 1
                }).show()
            }
            var b = {x: o, y: m};
            if (q.h != null) {
                b.y = q.h
            }
            if (q.v != null) {
                b.x = q.v
            }
            return b
        },
        hideSnapLine: function () {
            $("#designer_op_snapline_h").hide();
            $("#designer_op_snapline_v").hide();
            $("#designer_op_snapline_attach").hide()
        },
        groupDashboard: function (k, d, j, c) {
            $(".group_dashboard").hide();
            var h = $("#shape_group_dashboard_" + k);
            if (h.length == 0) {
                h = $("<div id='shape_group_dashboard_" + k + "' class='group_dashboard menu'></div>").appendTo("#designer_canvas");
                var l = SchemaGroup.getGroup(k);
                for (var e = 0; e < l.length; e++) {
                    var a = l[e];
                    var g = Schema.shapes[a];
                    if (g.attribute.visible) {
                         $("<div class='dashboard_box' shapeName='" + a + "'><canvas title='" + g.title + "' title_pos='right' width='" + (Designer.config.panelItemWidth) + "' height='" + (Designer.config.panelItemHeight) + "'></canvas></div>").appendTo(h);
                    }
                }
                h.bind("mousedown", function (i) {
                    i.stopPropagation()
                })
            }
            h.css({left: d, top: j, "z-index": Model.orderList.length + 1}).show();
            $(".dashboard_box").unbind().bind("click", function () {
                var i = $(this).attr("shapeName");
                c(i);
                h.hide();
                $(document).unbind("mousedown.group_dashboard")
            });
            $(document).bind("mousedown.group_dashboard", function () {
                h.hide();
                $(document).unbind("mousedown.group_dashboard")
            });
            return h
        }
    },
    events: {
        push: function (c, a) {
            var b = this.listeners[c];
            if (b) {
                return b(a);
            }
            return null;
        },
        listeners: {},
        addEventListener: function (b, a) {
            this.listeners[b] = a;
        }
    },
    clipboard: { //对齐设置
        elements: [],
        presetedIds: {},
        presetIds: function () {
            this.presetedIds = {};
            for (var b = 0; b < this.elements.length; b++) {
                var a = this.elements[b];
                this.presetedIds[a.id] = Utils.newId();
                if (a.group && !this.presetedIds[a.group]) {
                    this.presetedIds[a.group] = Utils.newId();
                }
            }
        },
        plus: true,
        copy: function () {
            this.elements = [];
            var d = Utils.getSelected();
            var c = Utils.getFamilyShapes(d);
            console.log(JSON.stringify(d));
            console.log(JSON.stringify(c));
            d = d.concat(c);
            d.sort(function e(g, f) {
                return g.props.zindex - f.props.zindex;
            });
            for (var b = 0; b < d.length; b++) {
                var a = Utils.copy(d[b]);
                if(a.name === "myPlace" || a.name === "legend"  ){
                    return false;
                }
                this.elements.push(a);
            }
            this.elements.sort(function e(g, f) {
                return g.props.zindex - f.props.zindex;
            });
            this.presetIds();
            this.plus = true;
        },
        leftalign: function () {
            var selectObj = Utils.getSelected(),
                minLeft = 999999999,
                ids = [],
                c = $.extend(true, [], selectObj);
            selectObj.forEach(function(i){
                if(i.props.x < minLeft){
                    minLeft = i.props.x;
                }
            });
            selectObj.forEach(function(i){
                ids.push(i.id);
                Model.define.elements[i.id].props.x = minLeft;
                $("#"+ i.id).css("left", minLeft);
            })
            Utils.unselect();
            Utils.selectShape(ids);
            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f);
        },
        centeralign: function(){
            var selectObj = Utils.getSelected(),
                ids = [],
                styleObj = {
                    minW: 999999,
                    maxW: 0
                },
                margin = 0,
                c = $.extend(true, [], selectObj),
                centerVal = parseInt($("#shape_controls").css("left"));

            selectObj.forEach(function(i){
                ids.push(i.id);

                if(i.props.x + i.props.w > styleObj.maxW){
                    styleObj.maxW = i.props.x + i.props.w;
                }

                if(i.props.x < styleObj.minW){
                    styleObj.minW = i.props.x;
                }
            });
            margin = Math.ceil((styleObj.maxW - styleObj.minW) / 2);

            centerVal += margin;
            for(var i = 0, ilen = selectObj.length; i < ilen; i++){
                var data = Model.define.elements[selectObj[i].id];
                data.props.x = centerVal - (data.props.w / 2);
                $("#"+ selectObj[i].id).css("left", centerVal - (data.props.w / 2));
            }
            Utils.unselect();
            Utils.selectShape(ids);

            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f);

        },
        rightalign: function () {
            var selectObj = Utils.getSelected(),
                minRight = 0,
                ids = [],
                c = $.extend(true, [], selectObj);

            selectObj.forEach(function(i){
                if((i.props.x + i.props.w) > minRight){
                    minRight = i.props.x + i.props.w;
                }
            });

            selectObj.forEach(function(i){
                ids.push(i.id);
                var right = minRight - i.props.w;
                Model.define.elements[i.id].props.x = right;
                $("#"+ i.id).css("left", right);
            })

            Utils.unselect();
            Utils.selectShape(ids);

            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f);
        },
        topalign: function () {
            var selectObj = Utils.getSelected(),
                minTop = 99999999999999,
                ids = [],
                c = $.extend(true, [], selectObj);

            selectObj.forEach(function(i){
                if(i.props.y < minTop){
                    minTop = i.props.y;
                }
            });

            selectObj.forEach(function(i){
                ids.push(i.id);
                Model.define.elements[i.id].props.y = minTop;
                $("#"+ i.id).css("top", minTop);
            })

            Utils.unselect();
            Utils.selectShape(ids);

            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f);
        },
        bottomalign: function () {
            var selectObj = Utils.getSelected(),
                minbottom = 0,
                ids = [],
                c = $.extend(true, [], selectObj);

            selectObj.forEach(function(i){
                if((i.props.y + i.props.h) > minbottom){
                    minbottom = i.props.y + i.props.h;
                }
            });

            selectObj.forEach(function(i){
                ids.push(i.id);
                var bottom = minbottom - i.props.h;
                Model.define.elements[i.id].props.y = bottom;
                $("#"+ i.id).css("top", bottom);
            })

            Utils.unselect();
            Utils.selectShape(ids);

            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f);
        },
        alCenter: function () {
            var selectObj = Utils.getSelected(),
                ids = [],
                styleObj = {
                    minW: 999999,
                    maxW: 0
                },
                margin= 0,
                c = $.extend(true, [], selectObj),
                centerVal = parseInt($("#shape_controls").css("top"));

            selectObj.forEach(function(i){
                ids.push(i.id);
                if(i.props.y + i.props.h > styleObj.maxW){
                    styleObj.maxW = i.props.y + i.props.h;
                }
                if(i.props.y < styleObj.minW){
                    styleObj.minW = i.props.y;
                }
            });
            margin = Math.ceil((styleObj.maxW - styleObj.minW) / 2);
            centerVal += margin;
            for(var i = 0, ilen = selectObj.length; i < ilen; i++){
                var data = Model.define.elements[selectObj[i].id];
                data.props.y = centerVal - (data.props.h / 2);
                $("#"+ selectObj[i].id).css("top", centerVal - (data.props.h / 2));
            }
            Utils.unselect();
            Utils.selectShape(ids);
            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f);
        },
        distributionlevelalign: function () {    // 水平分布

            var selectObj = Utils.getSelected(),
                ids = [],
                styleObj = {
                    minW: 999999,
                    maxW: 0
                },
                margin = 0,
                allleft = [],
                len = 0,
                c = $.extend(true, [], selectObj);


            selectObj.forEach(function(i){
                ids.push(i.id);
                allleft.push(i.props.x);

                if(i.props.x > styleObj.maxW){
                    styleObj.maxW = i.props.x
                }

                if(i.props.x < styleObj.minW){
                    styleObj.minW = i.props.x
                }
                len++;
            });
            margin = (styleObj.maxW - styleObj.minW) / (len - 1);

            allleft.sort(function(a,b){
                return b < a;
            });

            for(var i = 1, ilen = allleft.length - 1; i < ilen; i++){
                selectObj.forEach(function(j){
                    if(allleft[i] === j.props.x){
                        Model.define.elements[j.id].props.x = styleObj.minW + (i * margin);
                        $("#"+ j.id).css("left", styleObj.minW + (i * margin));
                    }
                });
            }

            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f)
        },
        distributionverticalalign: function () {    // 垂直分布

            var selectObj = Utils.getSelected(),
                ids = [],
                styleObj = {
                    minW: 999999,
                    maxW: 0
                },
                margin = 0,
                allleft = [],
                len = -1,
                c = $.extend(true, [], selectObj);

            selectObj.forEach(function(i){
                ids.push(i.id);
                allleft.push(i.props.y);
                if(i.props.y > styleObj.maxW){
                    styleObj.maxW = i.props.y
                }

                if(i.props.y < styleObj.minW){
                    styleObj.minW = i.props.y
                }
                len++;
            });
            margin = (styleObj.maxW - styleObj.minW) / len;

            allleft.sort(function(a,b){
                return b < a;
            });

            for(var i = 1, ilen = allleft.length - 1; i < ilen; i++){
                selectObj.forEach(function(j){
                    if(j.name === "tit"){
                        return;
                    }
                    if(allleft[i] === j.props.y){
                        Model.define.elements[j.id].props.y = styleObj.minW + (i * margin);
                        $("#"+ j.id).css("top", styleObj.minW + (i * margin));
                    }
                });
            }

            var d = $.extend(true, [], selectObj);
            var f = {shapes: c, updates: d};
            MessageSource.send("update", f)
        },
        cut: function () {
            this.copy();
            Designer.op.removeShape();
            this.plus = false;
        },
        paste: function (n, m) {
            if (this.elements.length == 0) {
                return;
            }
            var A = 20;
            var z = 20;
            if (typeof n != "undefined") {
                var g = Utils.getShapesBounding(this.elements);
                A = n - g.x - g.w / 2;
                z = m - g.y - g.h / 2;
            }
            var h = [];
            var d = [];
            for (var w = 0; w < this.elements.length; w++) {
                var a = this.elements[w];
                var C;
                var a = this.elements[w];
                a.props.zindex = Model.maxZIndex + (w + 1);
                var q = this.presetedIds[a.id];
                if (this.plus || typeof n != "undefined") {
                    a.props.x += A;
                    a.props.y += z;
                }
                C = Utils.copy(a);
                for (var v = 0; v < C.dataAttributes.length; v++) {
                    var s = C.dataAttributes[v];
                    s.id = Utils.newId();
                }
                C.id = q;
                if (C.children) {
                    for (var o = 0; o < C.children.length; o++) {
                        var u = C.children[o];
                        C.children[o] = this.presetedIds[u];
                    }
                }
                if (C.parent) {
                    C.parent = this.presetedIds[C.parent];
                }
                h.push(C);
                d.push(q);
                if (a.group) {
                    var f = this.presetedIds[a.group];
                    C.group = f;
                }
            }
            Model.addMulti(h);
            for (var w = 0; w < h.length; w++) {
                var a = h[w];
                Designer.painter.renderShape(a);
            }
            Model.build();
            this.presetIds();
            Utils.unselect();
            Utils.selectShape(d);
            this.plus = true;
        },
    },
    addFunction: function (b, a) {
        if (Designer[b]) {
            throw "Duplicate function name!";
        } else {
            this[b] = a;
        }
    },
    painter: {//画布
        renderShape: function (i, fn, isexitsave) {
            var k = $("#" + i.id);
            if(!isexitsave){
                IS_EXIT_SAVE = false;
            }
            if (k.length == 0) {
                var c = $("#designer_canvas");
                if(i.componentHtml){
                    var title;
                    if(i.name === "text" ){
                        title="双击"+ i.title+"编辑";
                    }else if(i.name === "uploadPhoto"){
                        title="双击"+ i.title;
                    }else{
                        title=i.title;
                    }
                    var nowele = $(i.componentHtml).addClass("shape_canvas").attr("data-title",title);
                    k = $("<div id='" + i.id + "' class='shape_box' >"+ nowele[0].outerHTML +"</div>").appendTo(c);
                }
                if(i.name === "longstring" ){
                    if(!!i.lineStyle.lineWidth){
                        $("#"+ i.id).find(".shape_canvas").css("width", i.lineStyle.lineWidth + "px");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("width",  "10px");
                    }

                    if(!!i.lineStyle.lineColor){
                        $("#"+ i.id).find(".shape_canvas").css("background-color", " rgb(" + i.lineStyle.lineColor + ")");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("background-color", " #7F7F7F");
                    }
                }
                if(i.name === "transverseline" ){
                    if(!!i.lineStyle.lineWidth){
                        $("#"+ i.id).find(".shape_canvas").css("height", i.lineStyle.lineWidth + "px");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("height",  "10px");
                    }

                    if(!!i.lineStyle.lineColor){
                        $("#"+ i.id).find(".shape_canvas").css("background-color", " rgb(" + i.lineStyle.lineColor + ")");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("background-color", " #7F7F7F");
                    }
                }
                if(i.name === 'text'){
                    if(!!i.fontStyle.color){
                        $("#"+ i.id).find(".shape_canvas").css("color"," rgb(" + i.fontStyle.color + ")");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("color","#fff");
                    }
                    if(!!i.fontStyle.size){
                        $("#"+ i.id).find(".shape_canvas").css("font-size", i.fontStyle.size);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("font-size","16px");
                    }
                    if(!!i.fontStyle.fontFamily){
                        $("#"+ i.id).find(".shape_canvas").css("font-family", i.fontStyle.fontFamily);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("font-family","微软雅黑");
                    }
                    if(!!i.componentsObj.textAer){
                        $("#"+ i.id).find(".shape_canvas").val(i.componentsObj.textAer);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").val("请输入文字");
                    }
                }
                if(i.name === 'mapTime'){
                    if(!!i.componentsObj.comsvgHtml){
                        $("#"+ i.id).find(".shape_canvas").html(i.componentsObj.comsvgHtml);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").html('<div class="mapTimeDiv"><p><span>10:24</span><small>AM</small></p><p><i>2017/09/26</i><em>星期二</em></p></div>');
                    }
                    if(!!i.props.w){
                        $("#"+ i.id).find(".shape_canvas").css("width",i.props.w+"px");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("width","195px");
                    }
                }
                if(i.name === 'myPlace'){
                    if(!!i.fontStyle.color){
                        $("#"+ i.id).find(".shape_canvas").css("color",  " rgb(" + i.fontStyle.color + ")");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("color","rgb(211, 55, 64)");
                    }
                    if(!!i.componentsObj.comsvgHtml){
                        $("#"+ i.id).find(".shape_canvas").html(i.componentsObj.comsvgHtml);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height:100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M839.2 388.8c0-179.8-146.6-325.6-327.6-325.6C330.7 63.2 184 209 184 388.8c0 59.4 16.3 114.9 44.2 162.8h-0.3l283.7 407 283.9-407h-0.5c28-48 44.2-103.4 44.2-162.8zM511.6 551.5c-90.5 0-163.8-72.9-163.8-162.8s73.3-162.8 163.8-162.8c90.5 0 163.8 72.9 163.8 162.8 0 90-73.3 162.8-163.8 162.8z"></path></svg>');
                    }
                }
                if(i.name === 'arrow'){
                    if(!!i.fontStyle.color){
                        $("#"+ i.id).find(".shape_canvas").css("color",  " rgb(" + i.fontStyle.color + ")");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("color","rgb(226, 170, 0)");
                    }
                    if(!!i.componentsObj.comsvgHtml){
                        $("#"+ i.id).find(".shape_canvas").html(i.componentsObj.comsvgHtml);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height: 100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1"  xmlns="http://www.w3.org/2000/svg" ><path d="M555.853 62l406.147 450-406.147 450zM62 292.625h624.015v438.75h-624.015v-438.75z" ></path></svg>');
                    }
                }
                if(i.name === 'obstacle'){
                    if(!!i.fontStyle.color){
                        $("#"+ i.id).find(".shape_canvas").css("color",  " rgb(" + i.fontStyle.color + ")");
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("color","#a4a4a4");
                    }
                    if(!!i.componentsObj.comsvgHtml){
                        $("#"+ i.id).find(".shape_canvas").html(i.componentsObj.comsvgHtml);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height: 100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M70.144 65.024v893.952h893.952V65.024H70.144z m464.896 564.224V512h235.008l-235.008 235.008v-117.76z m-35.84 281.6h-245.76l245.76-245.76v245.76z m35.84-109.568L824.32 512h92.16v107.008l-291.84 291.84h-89.088v-109.568zM916.48 472.064h-222.72L916.48 249.344v222.72z m0-286.208l-286.208 286.208h-94.72V402.432L825.344 112.64H916.48v73.216zM118.272 402.432L408.064 112.64h91.648v74.752L214.528 472.064H118.272V402.432z m416.768-201.216V113.152h229.888L535.04 343.04V201.216zM357.376 512L117.76 751.616V512h239.616z m-93.184-39.936l235.008-235.008v235.008H264.192z m88.064-358.912L118.272 347.136V113.152h233.984zM118.272 811.52L417.792 512h81.408v102.4l-296.96 296.96H118.272v-99.84z m557.056 99.328l241.152-241.152v241.152h-241.152z" ></path></svg>');
                    }
                }
                if(i.name === "uploadPhoto"){
                    if(!!i.componentsObj.imgurl){
                        $("#"+i.id+" .shape_canvas img").attr("src",i.componentsObj.imgurl);
                        $("#"+i.id+" .shape_canvas").css({
                            "backgroundImage": "url("+i.componentsObj.imgurl+")",
                            'backgroundSize': 'contain'
                        });
                    }else{
                        $("#"+i.id+" .shape_canvas img").attr("src","designer/images/imgDefault.png");
                        $("#"+i.id+" .shape_canvas").css({
                            "backgroundImage": "url(designer/images/imgDefault.png)"
                        });
                    }
                }
                if(i.name === "addComputer"){
                    cp_width= i.props.w;
                    cp_size= i.fontStyle.size == undefined ? cp_size : i.fontStyle.size;
                    if(!!i.componentsObj.computerNum){
                        $("#"+i.id+" .cpNum").val(i.componentsObj.computerNum);
                        $("#"+i.id+" .shape_canvas").attr("data-val",i.componentsObj.computerNum);
                    }else{
                        $("#"+i.id+" .cpNum").val("");
                        $("#"+i.id+" .shape_canvas").attr("data-val","");
                    }
                    if(!!i.componentsObj.computerBgColor){
                        $("#"+ i.id).find(".shape_canvas").css("background-color", " rgb(" + i.componentsObj.computerBgColor + ")");
                        $("#"+ i.id).find(".shape_canvas").children('input,span').css("background-color"," rgb(" + i.componentsObj.computerBgColor2 + ")");
                        $("#"+ i.id+" .shape_canvas").attr("data-state",i.componentsObj.state);
                    }else{
                        $("#"+ i.id).find(".shape_canvas").css("background-color", " #146b81");
                        $("#"+ i.id).find(".shape_canvas").children('input,span').css("background-color"," #2290ab");
                        $("#"+ i.id+" .shape_canvas").attr("data-state",0);
                    }
                }
                if(typeof fn === "function"){
                    fn();
                }
            }
            $(".text_content").text(Model.define.page.width + " * " + Model.define.page.height);
            if(Model.define.page.custom){
                $(".px-list-custom-click").text(Model.define.page.width + " * " + Model.define.page.height);
            }
            $("#canvas_container").css({backgroundImage:"url("+Model.define.page.backgroundImage+")",width: Model.define.page.width, height: Model.define.page.height, padding: Designer.config.pageMargin});
            var bj=Model.define.page.backgroundImage.substring(Model.define.page.backgroundImage.lastIndexOf("/")+1);
            $(".wallPaperList [data-bj = '"+bj+"']").addClass("action").siblings().removeClass("action");
            // $(" .sliderBf" ).slider("value",cp_width) ;
            $(" .fuChuang" ).html(cp_width+"px") ;
            $(".text_cp").html(cp_size+"px");
            if(i.name === "addComputer"){
                if(!!i.fontStyle.size){
                    $("#"+i.id+" .cpNum").css("font-size",i.fontStyle.size);
                }else{
                    $("#"+i.id+" .cpNum").css("font-size","12px");
                }
            }
            cpWSetShow();
            if(i !== ""){
                k.show();
                if(!!i.props.angle){
                    $("#"+ i.id).css({
                        "-ms-transform":"rotate("+ i.props.angle*180/Math.PI +"deg)",
                        "-moz-transform":" rotate("+ i.props.angle*180/Math.PI +"deg)",
                        "-webkit-transform":" rotate("+ i.props.angle*180/Math.PI +"deg)",
                        "-o-transform":" rotate("+ i.props.angle*180/Math.PI +"deg)",
                        "transform":"rotate("+ i.props.angle*180/Math.PI +"deg)"
                    });
                }else {
                    $("#"+ i.id).css({
                        "-ms-transform":" rotate(0deg)",
                        "-moz-transform":"rotate(0deg)",
                        "-webkit-transform":"rotate(0deg)",
                        "-o-transform":"rotate(0deg)",
                        "transform":"rotate(0deg)"
                    });
                }
                k.css({left: i.props.x + "px", top: i.props.y  + "px", width: i.props.w, height:i.props.h});
            }
        },
        controlStatus: {
            resizeDir: [],
            rotatable: true
        },
        drawControls: function (h) {
            var g = $("#shape_controls");
            if (g.length == 0) {
                var c = $("#designer_canvas");
                g = $("<div id='shape_controls'></div>").appendTo(c);
                g.append("<canvas id='controls_bounding'></canvas>");
                g.append("<div class='shape_controller' index='0' resizeDir='tl'></div>");
                g.append("<div class='shape_controller' index='1' resizeDir='tr'></div>");
                g.append("<div class='shape_controller' index='2' resizeDir='br'></div>");
                g.append("<div class='shape_controller' index='3' resizeDir='bl'></div>");
                g.append("<div class='shape_controller' resizeDir='l'></div>");
                g.append("<div class='shape_controller' resizeDir='t'></div>");
                g.append("<div class='shape_controller' resizeDir='r'></div>");
                g.append("<div class='shape_controller' resizeDir='b'></div>");
                Designer.op.shapeResizable();
                g.append("<div class='shape_rotater'><i></i></div>");
                Designer.op.shapeRotatable();
                g.append("<div class='group_icon change_shape_icon'></div>");
                Designer.op.groupShapeChangable();
                $(".shape_controller").css({
                    "border-color": Designer.config.anchorColor,
                    width: Designer.config.anchorSize - 2,
                    height: Designer.config.anchorSize - 2
                })
            }
            $(".shape_controller").css({"z-index": Model.orderList.length});
            g.show();
            var e = 0;
            var k;
            var d;
            if (h.length == 1) {
                var j = Model.getShapeById(h[0]);
                k = j.props;
                e = j.props.angle;
                d = j.resizeDir;
            } else {
                k = Utils.getControlBox(h);
                d = ["tl", "tr", "br", "bl"];
            }

            if(j !== undefined && j.length === undefined){
                if(j.name === "transverseline"){
                    d = ["l", "r"];
                }
                if(j.name === "longstring"){
                    d = ["t", "b"]
                }
            }

            var a = true;
            for (var f = 0; f < h.length; f++) {
                var b = h[f];
                var j = Model.getShapeById(b);
                if (j.attribute && j.attribute.rotatable == false) {
                    a = false;
                }
                if ((j.resizeDir && j.resizeDir.length == 0) || (j.parent && h.length > 1)) {
                    d = [];
                }
            }
            this.controlStatus.rotatable = a;
            this.controlStatus.resizeDir = d;
            this.rotateControls(k, e);
            return g
        },
        rotateControls: function (g, u) {
            var k = $("#shape_controls");
            var  l= Utils.getRotatedBox(g, u);
            var z = l.w.toScale();
            var h = l.h.toScale();
            k.css({left: l.x.toScale(), top: l.y.toScale(), "z-index": Model.orderList.length}).attr({"data-width": g.w, "data-height": g.h});
            var j = z + 20;
            var o = h + 20;
            var f = $("#controls_bounding");
            if(Utils.selectIds.length > 1){
                f.attr({width: j, height: o}).show();

                if(l.y.toScale() - 56 < 0){
                    $(".top-align-list2").css({left: l.x.toScale()-5, top: g.h+56}).show();
                }else if(l.x.toScale() + 310 > Model.define.page.width ){
                    $(".top-align-list2").css({left: l.x.toScale()- 310, top: l.y.toScale()-56}).show();
                }else{
                    $(".top-align-list2").css({left: l.x.toScale()-5, top: l.y.toScale()-56}).show();
                }

            }else{
                f.hide();
                $(".top-align-list2").hide();
            }
            var p = f[0].getContext("2d");
            p.lineJoin = "round";
            if (this.controlStatus.resizeDir.length == 0) {
                p.lineWidth = 2;
                p.strokeStyle = Designer.config.selectorColor;
                p.globalAlpha = 0.8
            } else {
                p.lineWidth = 1;
                p.strokeStyle = Designer.config.selectorColor;
                p.globalAlpha = 0.5
            }
            p.save();
            p.clearRect(0, 0, j, o);
            p.translate(j / 2, o / 2);
            p.rotate(u);
            p.translate(-j / 2, -o / 2);
            p.translate(9.5, 9.5);
            var b = {
                x: Math.round((g.x - l.x).toScale()),
                y: Math.round((g.y - l.y).toScale()),
                w: Math.floor(g.w.toScale() + 1),
                h: Math.floor(g.h.toScale() + 1)
            };
            p.strokeRect(b.x, b.y, b.w, b.h);
            var y = 0 - Designer.config.anchorSize / 2;
            var s = {};
            g = Utils.toScale(g);
            l = Utils.toScale(l);
            var v = {x: (g.x + g.w / 2), y: g.y + g.h / 2};
            k.children(".shape_controller").hide();
            for (var r = 0; r < this.controlStatus.resizeDir.length; r++) {
                var n = this.controlStatus.resizeDir[r];
                var a = $(".shape_controller[resizeDir=" + n + "]");
                a.show();
                var d, c;
                if (n.indexOf("l") >= 0) {
                    d = g.x
                } else {
                    if (n.indexOf("r") >= 0) {
                        d = g.x + g.w
                    } else {
                        d = g.x + g.w / 2
                    }
                }
                if (n.indexOf("t") >= 0) {
                    c = g.y
                } else {
                    if (n.indexOf("b") >= 0) {
                        c = g.y + g.h
                    } else {
                        c = g.y + g.h / 2
                    }
                }
                var e = Utils.getRotated(v, {x: d, y: c}, u);
                a.css({left: e.x - l.x + y, top: e.y - l.y + y});
            }
            var m = Math.PI / 8;
            k.children(".shape_controller").removeClass("s n e w");
            if (u > m && u <= m * 3) {
                k.children("div[resizeDir=tl]").addClass("n");
                k.children("div[resizeDir=tr]").addClass("e");
                k.children("div[resizeDir=br]").addClass("s");
                k.children("div[resizeDir=bl]").addClass("w");
                k.children("div[resizeDir=l]").addClass("n w");
                k.children("div[resizeDir=r]").addClass("s e");
                k.children("div[resizeDir=b]").addClass("s w");
                k.children("div[resizeDir=t]").addClass("n e");
            } else {
                if (u > m * 3 && u <= m * 5) {
                    k.children("div[resizeDir=tl]").addClass("n e");
                    k.children("div[resizeDir=tr]").addClass("s e");
                    k.children("div[resizeDir=br]").addClass("s w");
                    k.children("div[resizeDir=bl]").addClass("n w");
                    k.children("div[resizeDir=l]").addClass("n");
                    k.children("div[resizeDir=r]").addClass("s");
                    k.children("div[resizeDir=b]").addClass("w");
                    k.children("div[resizeDir=t]").addClass("e")
                } else {
                    if (u > m * 5 && u <= m * 7) {
                        k.children("div[resizeDir=tl]").addClass("e");
                        k.children("div[resizeDir=tr]").addClass("s");
                        k.children("div[resizeDir=br]").addClass("w");
                        k.children("div[resizeDir=bl]").addClass("n");
                        k.children("div[resizeDir=l]").addClass("n e");
                        k.children("div[resizeDir=r]").addClass("s w");
                        k.children("div[resizeDir=b]").addClass("n w");
                        k.children("div[resizeDir=t]").addClass("s e")
                    } else {
                        if (u > m * 7 && u <= m * 9) {
                            k.children("div[resizeDir=tl]").addClass("s e");
                            k.children("div[resizeDir=tr]").addClass("s w");
                            k.children("div[resizeDir=br]").addClass("n w");
                            k.children("div[resizeDir=bl]").addClass("n e");
                            k.children("div[resizeDir=l]").addClass("e");
                            k.children("div[resizeDir=r]").addClass("w");
                            k.children("div[resizeDir=b]").addClass("n");
                            k.children("div[resizeDir=t]").addClass("s")
                        } else {
                            if (u > m * 9 && u <= m * 11) {
                                k.children("div[resizeDir=tl]").addClass("s");
                                k.children("div[resizeDir=tr]").addClass("w");
                                k.children("div[resizeDir=br]").addClass("n");
                                k.children("div[resizeDir=bl]").addClass("e");
                                k.children("div[resizeDir=l]").addClass("s e");
                                k.children("div[resizeDir=r]").addClass("n w");
                                k.children("div[resizeDir=b]").addClass("n e");
                                k.children("div[resizeDir=t]").addClass("s w")
                            } else {
                                if (u > m * 11 && u <= m * 13) {
                                    k.children("div[resizeDir=tl]").addClass("s w");
                                    k.children("div[resizeDir=tr]").addClass("n w");
                                    k.children("div[resizeDir=br]").addClass("n e");
                                    k.children("div[resizeDir=bl]").addClass("s e");
                                    k.children("div[resizeDir=l]").addClass("s");
                                    k.children("div[resizeDir=r]").addClass("n");
                                    k.children("div[resizeDir=b]").addClass("e");
                                    k.children("div[resizeDir=t]").addClass("w")
                                } else {
                                    if (u > m * 13 && u <= m * 15) {
                                        k.children("div[resizeDir=tl]").addClass("w");
                                        k.children("div[resizeDir=tr]").addClass("n");
                                        k.children("div[resizeDir=br]").addClass("e");
                                        k.children("div[resizeDir=bl]").addClass("s");
                                        k.children("div[resizeDir=l]").addClass("s w");
                                        k.children("div[resizeDir=r]").addClass("n e");
                                        k.children("div[resizeDir=b]").addClass("s e");
                                        k.children("div[resizeDir=t]").addClass("n w")
                                    } else {
                                        k.children("div[resizeDir=tl]").addClass("n w");
                                        k.children("div[resizeDir=tr]").addClass("n e");
                                        k.children("div[resizeDir=br]").addClass("s e");
                                        k.children("div[resizeDir=bl]").addClass("s w");
                                        k.children("div[resizeDir=l]").addClass("w");
                                        k.children("div[resizeDir=r]").addClass("e");
                                        k.children("div[resizeDir=b]").addClass("s");
                                        k.children("div[resizeDir=t]").addClass("n")
                                    }
                                }
                            }
                        }
                    }
                }
            }

            //旋转功能
            if (this.controlStatus.rotatable) {
                var x = k.find(".shape_rotater");
                x.show();
                var w = {x: g.x + g.w / 2, y: g.y - 9};
                var t = Utils.getRotated(v, w, u);
                x.css({top: t.y - 9 - l.y, left: t.x - 9.5 - l.x});
            } else {
                k.find(".shape_rotater").hide();
            }
        }
    }
};

var Model = {
    define: {},
    persistence: {},
    orderList: [],
    maxZIndex: 3,
    linkerMap: {
        map: {},
        add: function (b, a) {
            if (!this.map[b]) {
                this.map[b] = [];
            }
            if (this.map[b].indexOf(a) < 0) {
                this.map[b].push(a);
            }
        },
        remove: function (b, a) {
            if (this.map[b]) {
                Utils.removeFromArray(this.map[b], a);
            }
        },
        empty: function () {
            this.map = {};
        }
    },
    groupMap: {
        map: {},
        add: function (a, b) {
            this.map[a] = b;
        },
        push: function (a, b) {
            if (!this.map[a]) {
                this.map[a] = [];
            }
            this.map[a].push(b);
        },
        remove: function (a) {
            delete this.map[a];
        },
        empty: function () {
            this.map = {};
        }
    },
    create: function (e, b, g) {
        var d = Utils.newId();
        var c = Utils.copy(Schema.shapes[e]);
        c.id = d;
        c.props.x = b;
        c.props.y = g;
        c.props.zindex = Model.maxZIndex + 1;
        c.props = $.extend(true, {}, Schema.shapeDefaults.props, c.props);
        for (var f = 0; f < c.dataAttributes.length; f++) {
            var a = c.dataAttributes[f];
            a.id = Utils.newId();
        }
        Designer.events.push("create", c);
        return c;
    },
    add: function (a, b) {
        this.addMulti([a], b);
    },
    addMulti: function (b, e) {
        if (typeof e == "undefined") {
            e = true;
        }
        var a = [];
        for (var d = 0; d < b.length; d++) {
            var c = b[d];
            a.push(Utils.copy(c));
            this.define.elements[c.id] = Utils.copy(c);
            this.persistence.elements[c.id] = Utils.copy(c);
        }
        this.build();
        if (e) {
            MessageSource.send("create", a);
        }
    },
    update: function (a) {
        this.updateMulti([a]);
    },
    updateMulti: function (c, isadd, ishisadd) {
        var a = [];
        var b = [];
        for (var e = 0; e < c.length; e++) {
            var d = c[e];
            if (this.define.elements[d.id]) {
                this.define.elements[d.id] = Utils.copy(d);
                if(isadd){
                    b.push(Utils.copy(this.getPersistenceById(d.id, true)));
                }else{
                    b.push(Utils.copy(this.getPersistenceById(d.id)));
                }
                a.push(Utils.copy(d));
                this.persistence.elements[d.id] = Utils.copy(d)
            }
        }
        this.build();
        if(ishisadd){
            return;
        }
        try{
            if(b[0].locked !== a[0].locked){
                b[0].props = a[0].props;
            }
        }catch (e){

        }
        var f = {shapes: b, updates: a};
        MessageSource.send("update", f);
    },
    remove: function (b, k, isaddHos) {
        if (typeof k == "undefined") {
            k = true
        }
        if (k) {
            b = Designer.events.push("beforeRemove", b)
        }
        var h = [];
        var n = [];
        var e = [];
        var o = [];
        var d = [];
        if (b.length == 0) {
            return false
        }
        for (var f = 0; f < b.length; f++) {
            var j = b[f];
            o.push(j.id)
        }
        for (var f = 0; f < b.length; f++) {
            var j = b[f];
            if(j.nodel && b.length === 1) continue;
            h.push(Utils.copy(j));
            $("#" + j.id).remove();
            delete this.define.elements[j.id];
            delete this.persistence.elements[j.id];
            this.groupMap.remove(j.group);
            if (j.parent && o.indexOf(j.parent) < 0) {
                var l = Model.getShapeById(j.parent);
                if (l) {
                    Utils.removeFromArray(l.children, j.id);
                    if (n.indexOf(j.parent) < 0) {
                        n.push(j.parent);
                        e.push(l)
                    }
                }
            }
        }
        this.build();
        MessageSource.beginBatch();
        if(!isaddHos){
            MessageSource.send("remove", h);
        }
        if (k) {
            var m = Designer.events.push("removed", {shapes: b, changedIds: n, range: o});
            if (m && m.length) {
                e = e.concat(m)
            }
        }
        if (e.length > 0) {
            this.updateMulti(e)
        }
        MessageSource.commit();
        return true
    },
    updatePage: function (a, c, isbool) {
        // if(Model.define.page.width === 1800){
        //     Model.define.page.width = 1920;
        //     Model.define.page.height = 1080;
        // }
        var b = $.extend(Model.define.page, a);
        var d = {page: Utils.copy(Model.persistence.page), update: Utils.copy(b)};
        Model.persistence.page = Utils.copy(b);
        MessageSource.send("updatePage", d);
        Designer.initialize.initCanvas();
        if(!!Model.define.page.custom && isbool){
            $(".px-list-custom-click").text(Model.define.page.width + " * " + Model.define.page.height);
        }
    },
    setTheme: function (b) {
        Model.define.theme = b;
        var c = {theme: Utils.copy(Model.persistence.theme), update: Utils.copy(b)};
        Model.persistence.theme = Utils.copy(b);
        MessageSource.send("setTheme", c);
        for (var d in Model.define.elements) {
            var a = Model.getShapeById(d);
            Designer.painter.renderShape(a)
        }
    },
    getShapeById: function (a) {
        return this.define.elements[a];
    },
    getPersistenceById: function (a, b) {
        if(b){
            if(!this.persistence.elements[a]){this.persistence.elements[a] = {}};
            this.persistence.elements[a].componentsObj = Model.define.elements[a].componentsObj;
            this.persistence.elements[a].ajaxUrl = Model.define.elements[a].ajaxUrl;
            this.persistence.elements[a].computerStyle = Model.define.elements[a].computerStyle;
            this.persistence.elements[a].scriptName = Model.define.elements[a].scriptName;
            this.persistence.elements[a].componenturl = Model.define.elements[a].componenturl;
        }
        return this.persistence.elements[a]
    },
    build: function () {
        this.orderList = [];
        for (var e in Model.define.elements) {
            var a = Model.getShapeById(e);
            this.orderList.push({id: a.id, zindex: a.props.zindex});
            if (a.group) {
                this.groupMap.push(a.group, a.id)
            }
        }
        this.orderList.sort(function d(g, f) {
            return g.zindex - f.zindex
        });
        for (var c = 0; c < Model.orderList.length; c++) {
            var e = Model.orderList[c].id;
            $("#" + e).css("z-index", c)
        }
        var b = 0;
        if (this.orderList.length > 0) {
            b = this.orderList[this.orderList.length - 1].zindex
        }
        this.maxZIndex = b
    },
    getGroupShapes: function (a) {
        return this.groupMap.map[a];
    },
    changeShape: function (b, e) {
        var c = Utils.copy(Schema.shapes[e]);
        b.name = e;
        b.title = c.shapeName;
        var a = c.attribute;
        if (b.attribute && typeof b.attribute.collapsed != "undefined") {
            a.collapsed = b.attribute.collapsed
        }
        if (b.attribute && typeof b.attribute.collapseW != "undefined") {
            a.collapseW = b.attribute.collapseW
        }
        if (b.attribute && typeof b.attribute.collapseH != "undefined") {
            a.collapseH = b.attribute.collapseH
        }
        if (b.attribute && b.attribute.markers && b.attribute.markers.indexOf("expand") >= 0) {
            if (!a.markers) {
                a.markers = []
            }
            a.markers.push("expand")
        }
        b.attribute = a;
        b.dataAttributes = c.dataAttributes;
        if (b.dataAttributes) {
            for (var d = 0; d < b.dataAttributes.length; d++) {
                var a = b.dataAttributes[d];
                a.id = Utils.newId()
            }
        }
        b.path = c.path;
        b.anchors = c.anchors;
        Schema.initShapeFunctions(b);
        Designer.painter.renderShape(b)
    }
};

var Utils = {
    getDomById: function (a) {
        return document.getElementById(a)
    },
    newId: function () {
        var b = Math.random();
        var a = (b + new Date().getTime());
        return a.toString(16).replace(".", "");
    },
    getShapeByPosition: function (M, L, G, Event, isLeft, tsobj) {
        var m = [];
        for (var U = Model.orderList.length - 1; U >= 0; U--) {
            var P = Model.orderList[U].id;
            var V = $("#" + P);
            var s = Model.getShapeById(P);
            if (s.attribute && s.attribute.collapseBy) {
                continue
            }
            var u = V.position();
            try{
                var F = M - u.left;
                var E = L - u.top;
            }catch (e){
                continue;
            }
            var Q = {x: u.left, y: u.top, w: V.width(), h: V.height()};
            if(!!isLeft) {
                Q.w += 0;
            }
            var S = V.find(".shape_canvas")[0];
            var k = S;
            var c = this.pointInRect(M, L, Q);
                if (c && s.locked && !G) {
                    var oa = 0;
                    if(!!isLeft) {
                        oa = 0;
                    }
                    if (F <= $(k).width() + oa && E <= $(k).height()) {    // 判断是否在F E区域之间
                        var t = {type: "shape", shape: s};
                        m.push(t)
                    }
                    continue
                }
                var N = 7;
                if (c) {
                    N = N.toScale();
                    var D = {x: M - N, y: L - N, w: N * 2, h: N * 2};
                    var I = {x: s.props.x + s.props.w / 2, y: s.props.y + s.props.h / 2};
                    var q = [];
                    try{
                        q = s.getAnchors();
                    }catch(e){
                        q = [];
                    }
                    var t = null;
                    for (var h = 0; h < q.length; h++) {
                        var f = q[h];
                        f = this.getRotated(I, {x: s.props.x + f.x, y: s.props.y + f.y}, s.props.angle);
                        if (Utils.pointInRect(f.x.toScale(), f.y.toScale(), D)) {
                            var r = Utils.getPointAngle(P, f.x, f.y, N);
                            f.angle = r;
                            t = {type: "bounding", shape: s, linkPoint: f};
                            if (parseInt($(k).css("width")) >= F && parseInt($(k).css("height")) >= E) {   // 判断是否在F E区域之间
                                t.inPath = true
                            }
                            break
                        }
                    }
                    if (t != null) {
                        m.push(t);
                        continue
                    }
                }
                if (!c) {
                    continue
                }
                var oa = 0;
                if(!!isLeft) {
                    oa = 0;
                }
                if(F <= $(k).width() + oa && E <= $(k).height()) {
                    if (G) {
                        var q = s.getAnchors();
                        if (q && q.length) {
                            var z = false;
                            for (var T = U + 1; T < Model.orderList.length; T++) {
                                var a = Model.orderList[T].id;
                                var R = Model.getShapeById(a);
                                if (Utils.rectInRect(R.props, s.props)) {
                                    z = true;
                                    continue
                                }
                            }
                            if (z) {
                                continue
                            }
                            var t = {type: "shape", shape: s};
                            m.push(t);
                            continue
                        } else {
                            continue
                        }
                    } else {
                        var t = {type: "shape", shape: s};
                        m.push(t);
                        continue
                    }
                } else {
                    if (!s.attribute || typeof s.attribute.linkable == "undefined" || s.attribute.linkable) {
                        var r = Utils.getPointAngle(P, M.restoreScale(), L.restoreScale(), N, Event);
                        if (r != null) {
                            var t = null;
                            var b = {angle: r};
                            for (var H = 1; H <= N; H++) {
                                if (r == 0) {
                                    b.x = F + H;
                                    b.y = E
                                } else {
                                    if (r < Math.PI / 2) {
                                        b.x = F + H * Math.cos(r);
                                        b.y = E + H * Math.sin(r)
                                    } else {
                                        if (r == Math.PI / 2) {
                                            b.x = F;
                                            b.y = E + H
                                        } else {
                                            if (r < Math.PI) {
                                                b.x = F - H * Math.sin(r - Math.PI / 2);
                                                b.y = E + H * Math.cos(r - Math.PI / 2)
                                            } else {
                                                if (r == Math.PI) {
                                                    b.x = F - H;
                                                    b.y = E
                                                } else {
                                                    if (r < Math.PI / 2 * 3) {
                                                        b.x = F - H * Math.cos(r - Math.PI);
                                                        b.y = E - H * Math.sin(r - Math.PI)
                                                    } else {
                                                        if (r == Math.PI / 2 * 3) {
                                                            b.x = F;
                                                            b.y = E - H
                                                        } else {
                                                            b.x = F + H * Math.sin(r - Math.PI / 2 * 3);
                                                            b.y = E - H * Math.cos(r - Math.PI / 2 * 3)
                                                        }
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                                if(b.x == Event.offsetX && b.y == Event.offsetY) {
                                    b.x += u.left;
                                    b.y += u.top;
                                    b.x = b.x.restoreScale();
                                    b.y = b.y.restoreScale();
                                    t = {type: "bounding", shape: s, linkPoint: b};
                                    break
                                }
                            }
                            if (t != null) {
                                m.push(t);
                                continue;
                            }
                        }
                    }
                }

        }
        var t = null;
        if (m.length == 1) {
            t = m[0]
        }
        if (m.length > 1 && G) {
            t = m[0]
        } else {
            if (m.length > 1) {
                var g = m[0];
                var B = [];
                var d = [];
                var o = [];
                for (var U = 0; U < m.length; U++) {
                    var O = m[U];
                    if (O.type == "bounding") {
                        o.push(O)
                    }
                }
                if (o.length > 0 && d.length > 0) {
                    for (var U = 0; U < o.length; U++) {
                        var O = o[U];
                        if (O.inPath) {
                            t = O;
                            break
                        }
                    }
                }
                if (t == null && d.length > 0) {
                    d.sort(function e(j, i) {
                        if (Utils.isSelected(j.shape.id) && !Utils.isSelected(i.shape.id)) {
                            return -1
                        } else {
                            if (!Utils.isSelected(j.shape.id) && Utils.isSelected(i.shape.id)) {
                                return 1
                            } else {
                                return i.shape.props.zindex - j.shape.props.zindex
                            }
                        }
                    });
                    t = d[0]
                }
                if (t == null && B.length > 0) {
                    B.sort(function e(j, i) {
                        if (Utils.isSelected(j.shape.id) && !Utils.isSelected(i.shape.id)) {
                            return -1
                        } else {
                            if (!Utils.isSelected(j.shape.id) && Utils.isSelected(i.shape.id)) {
                                return 1
                            } else {
                                return i.shape.props.zindex - j.shape.props.zindex
                            }
                        }
                    });
                    t = B[0]
                }
                if (t == null) {
                    t = m[0]
                }
            }
        }

        if(!!tsobj){
            t = {
                type: "shape",
                shape: tsobj
            }
        }
        return t
    },
    rectCross: function (h, g) {
        var d = h.x;
        var f = h.x + h.w;
        var j = h.y;
        var b = h.y + h.h;
        var c = g.x;
        var e = g.x + g.w;
        var i = g.y;
        var a = g.y + g.h;
        if (((d < e) && (c < f)) && ((j < a) && (i < b))) {
            return true
        } else {
            return false
        }
    },
    rectInRect: function (c, a) {
        var f = {x: c.x, y: c.y};
        var e = {x: c.x + c.w, y: c.y};
        var d = {x: c.x + c.w, y: c.y + c.h};
        var b = {x: c.x, y: c.y + c.h};
        if (this.pointInRect(f.x, f.y, a) && this.pointInRect(e.x, e.y, a) && this.pointInRect(d.x, d.y, a) && this.pointInRect(b.x, b.y, a)) {
            return true
        } else {
            return false
        }
    },
    pointInRect: function (b, a, c) {
        if (b >= c.x && b <= c.x + c.w && a >= c.y && a <= c.y + c.h) {
            return true
        }
        return false
    },
    getShapesByRange: function (c) {
        var a = [];
        for (var e in Model.define.elements) {
            var b = Model.getShapeById(e);
            var d = b.props;
            d = this.getShapeBox(b);
            if (this.pointInRect(d.x, d.y, c) && this.pointInRect(d.x + d.w, d.y, c) && this.pointInRect(d.x + d.w, d.y + d.h, c) && this.pointInRect(d.x, d.y + d.h, c)) {
                a.push(b.id);
            }
        }
        return a;
    },
    getControlBox: function (e) {
        var g = {x1: null, y1: null, x2: null, y2: null};
        for (var b = 0; b < e.length; b++) {
            var f = e[b];
            var a = Model.getShapeById(f);
            var d;
            d = this.getShapeBox(a);
            if (g.x1 == null || d.x < g.x1) {
                g.x1 = d.x
            }
            if (g.y1 == null || d.y < g.y1) {
                g.y1 = d.y
            }
            if (g.x2 == null || d.x + d.w > g.x2) {
                g.x2 = d.x + d.w
            }
            if (g.y2 == null || d.y + d.h > g.y2) {
                g.y2 = d.y + d.h
            }
        }
        var c = {x: g.x1, y: g.y1, w: g.x2 - g.x1, h: g.y2 - g.y1};
        return c;
    },
    getShapesBounding: function (a) {
        var f = {x1: null, y1: null, x2: null, y2: null};
        for (var c = 0; c < a.length; c++) {
            var b = a[c];
            var d;
            d = b.props;
            if (f.x1 == null || d.x < f.x1) {
                f.x1 = d.x;
            }
            if (f.y1 == null || d.y < f.y1) {
                f.y1 = d.y;
            }
            if (f.x2 == null || d.x + d.w > f.x2) {
                f.x2 = d.x + d.w;
            }
            if (f.y2 == null || d.y + d.h > f.y2) {
                f.y2 = d.y + d.h;
            }
        }
        var e = {x: f.x1, y: f.y1, w: f.x2 - f.x1, h: f.y2 - f.y1};
        return e;
    },
    getShapeContext: function (b) {
        var a = Utils.getDomById(b);
        return a.getElementsByTagName("div");
    },
    selectIds: [],
    selectShape: function (h, d, toolbar) {
        if(toolbar !== "toolbar"){
            $(".toolbar-error").hide();
        }
        if (typeof h == "string") {
            var m = h;
            h = [];
            h.push(m);
        }
        if (h.length <= 0) {
            return
        }
        var j = [];
        for (var f = 0; f < h.length; f++) {
            var b = h[f];
            var l = Model.getShapeById(b);
            j.push(b);
            if (l.group) {
                var c = Model.getGroupShapes(l.group);
                Utils.mergeArray(j, c)
            }
        }
        var a = [];
        for (var f = 0; f < j.length; f++) {
            var b = j[f];
            var l = Model.getShapeById(b);
            if (l.parent && l.resizeDir.length == 0 && a.indexOf(l.parent) < 0) {
                a.push(l.parent);
            } else {
                if (a.indexOf(b) < 0) {
                    a.push(b);
                }
            }
        }
        h = a;
        Utils.selectIds = [];
        for (var k = 0; k < h.length; k++) {
            var m = h[k];
            var l = Model.getShapeById(m);
            Utils.selectIds.push(m);
            if (this.isLocked(l.id)) {
                $('#'+l.id).css("overflow","inherit");
                Utils.showLockers(l);
            }
        }
        var a = Utils.getSelectedIds();
        var n = false;
        if (a.length > 0 && !n) {
            Designer.painter.drawControls(a);
            if(h.length === 1){
                if(Model.define.elements[h[0]].name === "addComputer"  || Model.define.elements[h[0]].name === "mapTime"){
                    $(".shape_controller").addClass("cursor");
                }else{
                    $(".shape_controller").removeClass("cursor");
                }
            }
        }
        if (typeof d == "undefined") {
            d = true
        }
        if (this.selectCallback && d) {
            this.selectCallback()
        }
        Designer.events.push("selectChanged");
        if(Utils.selectIds.length === 1){
            $("#toolBarSizeDiv").show();
            $(".toolbar-size").removeClass("toolbar-size-disable");
            var styleData = Model.define.elements[Utils.selectIds[0]];
            var elObj = {
                w: $(".toolbar-size input[data-type=width]"),
                h: $(".toolbar-size input[data-type=height]"),
                x: $(".toolbar-size input[data-type=x]"),
                y: $(".toolbar-size input[data-type=y]")
            }

            if(toolbar !== "toolbar"){
                elObj.w.val(Math.floor(styleData.props.w));
                elObj.h.val(Math.floor(styleData.props.h));
                elObj.x.val(Math.floor(styleData.props.x));
                elObj.y.val(Math.floor(styleData.props.y));
            }
            $(".toolbar-error").attr("data-id", Utils.selectIds[0]);
            $(".toolbar-size input,.CPNumTxt").show();
            $(".toolbar-component-disabled").hide();
            if(styleData.name == "longstring"){
                elObj.w.parent(".toolbar-size").hide();
                elObj.h.parent(".toolbar-size").show();
            }else  if(styleData.name == "transverseline"){
                elObj.w.parent(".toolbar-size").show();
                elObj.h.parent(".toolbar-size").hide();
            }else  if(styleData.name == "text" || styleData.name == "mapTime") {
                elObj.w.parent(".toolbar-size").hide();
                elObj.h.parent(".toolbar-size").hide();
            }else if (styleData.name == "addComputer") {
                $("#CPNum").show();
                $("#CPNum input[data-type=cpnum]").val(styleData.componentsObj.computerNum);
                elObj.w.parent(".toolbar-size").hide();
                elObj.h.parent(".toolbar-size").hide();
            }else {
                elObj.w.parent(".toolbar-size").show();
                elObj.h.parent(".toolbar-size").show();
            }
        }
        if(Utils.selectIds.length >= 2){
            $("#component-align").removeClass("disabled")
            $(".top-align-list-items[act=distributionvertical]").addClass("align-icon-disabled");
            $(".top-align-list-items[act=distributionlevel]").addClass("align-icon-disabled");
        }
        if(Utils.selectIds.length >= 3) {
            $(".top-align-list-items[act=distributionvertical]").removeClass("align-icon-disabled");
            $(".top-align-list-items[act=distributionlevel]").removeClass("align-icon-disabled");
        }
    },
    selectCallback: null,
    unselect: function () {
        if($(".toolbar-error").attr("data-lock") === "true"){
            return false;
        }
        this.selectIds = [];
        $("#component-align").addClass("disabled");
        $(".top-align-list-items[act=distributionvertical]").addClass("align-icon-disabled");
        $(".top-align-list-items[act=distributionlevel]").addClass("align-icon-disabled");
        $("#shape_controls,#toolBarSizeDiv,#CPNum,#setHf,#font_f,#font_s,#color_picker,#background_picker,#line_width_list,#font_cps,.setStateDiv").hide();
        $(".top-align-list2").hide();
        Utils.removeLockers();
        Designer.events.push("selectChanged");
        $(".toolbar-size input[data-type=width]").attr({"data-val": $(".toolbar-size input[data-type=width]").val()});
        $(".toolbar-size input[data-type=height]").attr({"data-val": $(".toolbar-size input[data-type=height]").val()});
        $(".toolbar-size input[data-type=x]").attr({"data-val": $(".toolbar-size input[data-type=x]").val()});
        $(".toolbar-size input[data-type=y]").attr({"data-val": $(".toolbar-size input[data-type=y]").val()});
        $("#CPNum input[data-type=cpnum]").attr({"data-val":$("#CPNum input[data-type=cpnum]").val()});
        $(".toolbar-size input").hide();
        $(".toolbar-component-disabled").css("display", "block");
        //$(".shape_rotater").remove();
    },
    getSelected: function () {
        var a = [];
        for (var b = 0; b < this.selectIds.length; b++) {
            var d = this.selectIds[b];
            if (!Utils.isLocked(d)) {
                var c = Model.getShapeById(d);
                a.push(c);
            }
        }
        return a
    },
    getNotLockSelected: function () {
        var a = [];
        for (var b = 0; b < this.selectIds.length; b++) {
            var d = this.selectIds[b];
            var c = Model.getShapeById(d);
            a.push(c);
        }
        return a;
    },
    getSelectedIds: function () {
        var a = [];
        for (var b = 0; b < this.selectIds.length; b++) {
            var c = this.selectIds[b];
            if (!Utils.isLocked(c)) {
                a.push(c);
            }
        }
        return a
    },
    getSelectedLockedIds: function () {
        var a = [];
        for (var b = 0; b < this.selectIds.length; b++) {
            var c = this.selectIds[b];
            if (Utils.isLocked(c)) {
                a.push(c)
            }
        }
        return a
    },
    isSelected: function (a) {
        if (this.selectIds.indexOf(a) >= 0 && !this.isLocked(a)) {
            return true
        }
        return false
    },
    isLocked: function (a) {
        if (!!Model.getShapeById(a) && Model.getShapeById(a).locked) {
            return true
        } else {
            return false
        }
    },
    showLockers: function (d) {
        var j = $("#" + d.id);
        $("<canvas class='shape_locker' width='10px' height='10px' style='top:-5px;left:-5px;'></canvas>").appendTo(j);
        $("<canvas class='shape_locker' width='10px' height='10px' style='top:-5px;right:-5px;'></canvas>").appendTo(j);
        $("<canvas class='shape_locker' width='10px' height='10px' style='bottom:-5px;left:-5px;'></canvas>").appendTo(j);
        $("<canvas class='shape_locker' width='10px' height='10px' style='bottom:-5px;right:-5px;'></canvas>").appendTo(j);
    },
    removeLockers: function () {
        $(".shape_locker").remove();
    },
    measureDistance: function (d, c) {
        var b = c.y - d.y;
        var a = c.x - d.x;
        return Math.sqrt(Math.pow(b, 2) + Math.pow(a, 2))
    },
    removeFromArray: function (c, b) {
        var a = c.indexOf(b);
        if (a >= 0) {
            c.splice(a, 1)
        }
        return c
    },
    mergeArray: function (b, a) {
        for (var c = 0; c < a.length; c++) {
            var d = a[c];
            if (b.indexOf(d) < 0) {
                b.push(d)
            }
        }
        return b
    },
    getCirclePoints: function (a, h, e) {
        var g = Math.PI / 18;
        var d = [];
        for (var c = 0; c < 36; c++) {
            var b = g * c;
            var f = {x: a - Math.cos(b) * e, y: h - Math.sin(b) * e, angle: b};
            d.push(f)
        }
        return d
    },
    getPointAngle: function (n, q, o, a, Event) {
        var j = $("#" + n).position();
        var h = Utils.getShapeContext(n);
        q = q.toScale() - j.left;
        o = o.toScale() - j.top;
        var b = this.getCirclePoints(q, o, a);
        var m = b.length;
        var t = false;
        for (var k = 0; k < m; k++) {
            var c = b[k];
            if (c.x <= parseInt($(h).parents(".shape_box").css("left")) && c.y <= parseInt($(h).parents(".shape_box").css("top"))) {
                c.inPath = true;
                t = true
            } else {
                c.inPath = false
            }
        }
        if (t == false) {
            return null
        }
        var d = null;
        var g = null;
        for (var k = 0; k < m; k++) {
            var c = b[k];
            if (!c.inPath) {
                if (d == null) {
                    var f = b[(k - 1 + m) % m];
                    if (f.inPath) {
                        d = c.angle
                    }
                }
                if (g == null) {
                    var l = b[(k + 1 + m) % m];
                    if (l.inPath) {
                        g = c.angle
                    }
                }
                if (d != null && g != null) {
                    break
                }
            }
        }
        var s = (Math.PI * 2 + g - d) % (Math.PI * 2) / 2;
        var e = (d + s) % (Math.PI * 2);
        return e
    },
    getShapeBox: function (a) {
        var b = a.props;
        var c = a.props.angle;
        return this.getRotatedBox(b, c)
    },
    getRotatedBox: function (g, e, b) {
        if (e == 0) {
            return g
        } else {
            if (!b) {
                b = {x: g.x + g.w / 2, y: g.y + g.h / 2}
            }
            var k = this.getRotated(b, {x: g.x, y: g.y}, e);
            var j = this.getRotated(b, {x: g.x + g.w, y: g.y}, e);
            var i = this.getRotated(b, {x: g.x + g.w, y: g.y + g.h}, e);
            var h = this.getRotated(b, {x: g.x, y: g.y + g.h}, e);
            var f = Math.min(k.x, j.x, i.x, h.x);
            var c = Math.max(k.x, j.x, i.x, h.x);
            var d = Math.min(k.y, j.y, i.y, h.y);
            var a = Math.max(k.y, j.y, i.y, h.y);
            return {x: f, y: d, w: c - f, h:a - d}
        }
    },
    getRotated: function (c, b, g) {
        var f = this.measureDistance(c, b);
        if (f == 0 || g == 0) {
            return b
        }
        var d = Math.atan(Math.abs(b.x - c.x) / Math.abs(c.y - b.y));
        if (b.x >= c.x && b.y >= c.y) {
            d = Math.PI - d
        } else {
            if (b.x <= c.x && b.y >= c.y) {
                d = Math.PI + d
            } else {
                if (b.x <= c.x && b.y <= c.y) {
                    d = Math.PI * 2 - d
                }
            }
        }
        d = d % (Math.PI * 2);
        var e = (d + g) % (Math.PI * 2);
        var a = {x: c.x + Math.sin(e) * f, y: c.y - Math.cos(e) * f};
        return a
    },
    toScale: function (c) {
        var a = {};
        for (var b in c) {
            a[b] = c[b];
            if (typeof c[b] == "number") {
                a[b] = a[b].toScale()
            }
        }
        return a
    },
    restoreScale: function (c) {
        var a = {};
        for (var b in c) {
            a[b] = c[b];
            if (typeof c[b] == "number") {
                a[b] = a[b].restoreScale();
            }
        }
        return a
    },
    getFamilyShapes: function (a) {
        var g = [];
        for (var d = 0; d < a.length; d++) {
            var b = a[d];
            if (b.parent) {
                var f = Model.getShapeById(b.parent);
                if (!Utils.isSelected(b.parent)) {
                    g.push(f);
                }
                var e = this.getChildrenShapes(f);
                g = g.concat(e);
            }
            var c = this.getChildrenShapes(b);
            g = g.concat(c);
        }
        return g;
    },
    getChildrenShapes: function (a) {
        var c = [];
        if (a.children && a.children.length > 0) {
            for (var b = 0; b < a.children.length; b++) {
                var d = a.children[b];
                if (!Utils.isSelected(d)) {
                    c.push(Model.getShapeById(d))
                }
            }
        }
        return c
    },
    isFamilyShape: function (b, a) {
        if (b.parent == a.id) {
            return true
        } else {
            if (b.id == a.parent) {
                return true
            } else {
                if (b.parent && b.parent == a.parent) {
                    return true
                }
            }
        }
        return false
    },
    getContainedShapes: function (c) {
        var b = [];
        var e = [];
        for (var f = 0; f < c.length; f++) {
            var d = c[f];
            if ( d.attribute && d.attribute.container) {
                var g = a(d);
                b = b.concat(g)
            }
        }
        function a(h) {
            var l = [];
            for (var k = Model.orderList.length - 1; k >= 0; k--) {
                var n = Model.orderList[k].id;
                if (h.id != n && !Utils.isSelected(n) && e.indexOf(n) < 0) {
                    var j = Model.getShapeById(n);
                    if (!j.attribute || typeof j.attribute.container == "undefined" || j.attribute.container == false) {
                        if (!Utils.isFamilyShape(j, h)) {
                            var m = Utils.getShapeBox(j);
                            if (Utils.rectInRect(m, h.props) && j.container == h.id) {
                                l.push(j);
                                e.push(n)
                            }
                        }
                    }
                }
            }
            return l
        }

        return b
    },
    copy: function (a) {
        return $.extend(true, {}, a);
    },
    getRelativePos: function (c, b, d, e) {
        var a = "";
        e ? a = $("#designer_canvas").offset() : a = d.offset();
        if (a == null) {
            a = {left: 0, top: 0};
        }
        return {x: c - a.left + d.scrollLeft(), y: b - a.top + d.scrollTop()};
    },
    getCollapsedShapesById: function (e) {
        var a = [];
        for (var c = Model.orderList.length - 1; c >= 0; c--) {
            var d = Model.orderList[c].id;
            var b = Model.getShapeById(d);
            if (b.attribute && b.attribute.collapseBy == e) {
                a.push(b)
            }
        }
        return a
    },
    getShapeLineStyle: function (a, b) {
        if (b == false || !Model.define.theme || !Model.define.theme.shape) {
            return $.extend({}, Schema.shapeDefaults.lineStyle, a)
        } else {
            return $.extend({}, Schema.shapeDefaults.lineStyle, Model.define.theme.shape.lineStyle, a)
        }
    },
    getShapeFontStyle: function (b, a) {
        if (a == false || !Model.define.theme || !Model.define.theme.shape) {
            return $.extend({}, Schema.shapeDefaults.fontStyle, b)
        } else {
            return $.extend({}, Schema.shapeDefaults.fontStyle, Model.define.theme.shape.fontStyle, b)
        }
    },
    getShapeFillStyle: function (a, b) {
        if (b == false || !Model.define.theme || !Model.define.theme.shape) {
            return $.extend({}, Schema.shapeDefaults.fillStyle, a);
        } else {
            return $.extend({}, Schema.shapeDefaults.fillStyle, Model.define.theme.shape.fillStyle, a);
        }
    }
};

var MessageSource = {
    batchSize: 0,
    messages: [],
    withUndo: true,
    withMessage: true,
    withDock: true,
    undoStack: {
        stack: [],
        push: function (b, a) {
            this.stack.push(b);
            if (typeof a == "undefined") {
                a = true
            }
            if (a) {
                MessageSource.redoStack.stack = []
            }
            Designer.events.push("undoStackChanged", this.stack.length)
        },
        pop: function () {
            var b = this.stack.length;
            if (b == 0) {
                $("#bar_undo").addClass("disabled");
                return null;
            }
            var a = this.stack[b - 1];
            this.stack.splice(b - 1, 1);
            MessageSource.redoStack.push(a);
            Designer.events.push("undoStackChanged", this.stack.length);
            if(this.stack.length === 0){
                $("#bar_undo").addClass("disabled");
            }else{
                $("#bar_undo").removeClass("disabled");
            }
            $("#bar_redo").removeClass("disabled");
            return a;
        }
    },
    redoStack: {
        stack: [],
        push: function (a) {
            this.stack.push(a);
            Designer.events.push("redoStackChanged", this.stack.length);
        },
        pop: function () {
            var b = this.stack.length;
            if (b == 0) {
                $("#bar_redo").addClass("disabled");
                return null
            }
            var a = this.stack[b - 1];
            this.stack.splice(b - 1, 1);
            MessageSource.undoStack.push(a, false);
            Designer.events.push("redoStackChanged", this.stack.length);
            if(this.stack.length === 0){
                $("#bar_redo").addClass("disabled");
            }else{
                $("#bar_redo").removeClass("disabled");
            }
            $("#bar_undo").removeClass("disabled");
            return a
        }
    },
    beginBatch: function () {
        this.batchSize++
    },
    commit: function () {
        this.batchSize--;
        this.submit()
    },
    submit: function () {
        if (this.batchSize == 0 && this.messages.length != 0) {
            if (this.withMessage == false) {
                this.messages = [];
                return
            }
            if (this.withUndo) {
                this.undoStack.push(this.messages);
            }
            this.messages = []
        }
    },
    updataCompontent: function(g, b){
        b = $.extend(true, {}, b);
        Utils.unselect();
        if(IS_SELECT) {
            $(".computer-top-nav").hide();
        }
    },
    removeUpdataComponent: function(b){
        Utils.unselect();
        if(IS_SELECT) {
            $(".computer-top-nav").hide();
        }
    },
    send: function (b, a) {
        IS_EXIT_SAVE = false;
        this.messages.push({action: b, content: a});
        this.submit();
    },
    undo: function () {
        var a = this.undoStack.pop();
        if (a == null) {
            return
        }
        this.doWithoutUndo(function () {
            MessageSource.beginBatch();
            for (var d = 0; d < a.length; d++) {
                var g = a[d];
                if (g.action == "create") {
                    Utils.unselect();
                    $("#shape_controls,#toolBarSizeDiv,#CPNum,#setHf,#font_f,#font_s,#color_picker,#background_picker,#line_width_list").hide();
                    Model.remove(g.content, false);
                } else {
                    if (g.action == "update") {
                        var b = g.content.shapes;
                        Model.updateMulti(b);
                        for (var c = 0; c < b.length; c++) {
                            var f = b[c];
                            Designer.painter.renderShape(f);
                            if(!!f.props.angle){
                                $("#"+ f.id).css({
                                    "-ms-transform":" rotate("+ f.props.angle*180/Math.PI +"deg)",
                                    "-moz-transform":" rotate("+ f.props.angle*180/Math.PI +"deg)",
                                    "-webkit-transform":" rotate("+ f.props.angle*180/Math.PI +"deg)",
                                    "-o-transform":" rotate("+ f.props.angle*180/Math.PI +"deg)",
                                    "transform":" rotate("+ f.props.angle*180/Math.PI +"deg)"
                                });
                            }else{
                                $("#"+ f.id).css({
                                    "-ms-transform":" rotate(0deg)",
                                    "-moz-transform":" rotate(0deg)",
                                    "-webkit-transform":" rotate(0deg)",
                                    "-o-transform":" rotate(0deg)",
                                    "transform":" rotate(0deg)"
                                });
                            }
                            if(f.name === "longstring" ){    // 横线
                                if(!!f.lineStyle.lineWidth){
                                    $("#"+ f.id).find(".shape_canvas").css("width", f.lineStyle.lineWidth + "px");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("width","10px");
                                }
                                if(!!f.lineStyle.lineColor){
                                    $("#"+ f.id).find(".shape_canvas").css("background-color"," rgb(" + f.lineStyle.lineColor + ")");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("background-color"," #7F7F7F");
                                }
                            }
                            if(f.name === "transverseline" ){    // 横线
                                if(!!f.lineStyle.lineWidth){
                                    $("#"+ f.id).find(".shape_canvas").css("height", f.lineStyle.lineWidth + "px");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("height","10px");
                                }
                                if(!!f.lineStyle.lineColor){
                                    $("#"+ f.id).find(".shape_canvas").css("background-color"," rgb(" + f.lineStyle.lineColor + ")");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("background-color"," #7F7F7F");
                                }
                            }
                            if(f.name === "text"){
                                if(!!f.fontStyle.color){
                                    $("#"+ f.id).find(".shape_canvas").css("color", "rgb(" + f.fontStyle.color + ")");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("color", "#fff");
                                }
                                if(!!f.fontStyle.fontFamily){
                                    $("#"+ f.id).find(".shape_canvas").css("font-family", f.fontStyle.fontFamily);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("font-family", "宋体");
                                }
                                if(!!f.fontStyle.size){
                                    $("#"+ f.id).find(".shape_canvas").css("font-size", f.fontStyle.size);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("font-size","16px");
                                }
                                if(!!f.componentsObj.textAer){
                                    $("#"+ f.id).find(".shape_canvas").val(f.componentsObj.textAer);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").val("请输入文字");
                                }
                            }
                            if(f.name === "myPlace"){
                                if(!!f.fontStyle.color){
                                    $("#"+ f.id).find(".shape_canvas").css("color", " rgb(" + f.fontStyle.color + ")");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("color", " rgb(209, 91, 91)");
                                }
                                if(!!f.componentsObj.comsvgHtml){
                                    $("#"+ f.id).find(".shape_canvas").html(f.componentsObj.comsvgHtml);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height:100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M839.2 388.8c0-179.8-146.6-325.6-327.6-325.6C330.7 63.2 184 209 184 388.8c0 59.4 16.3 114.9 44.2 162.8h-0.3l283.7 407 283.9-407h-0.5c28-48 44.2-103.4 44.2-162.8zM511.6 551.5c-90.5 0-163.8-72.9-163.8-162.8s73.3-162.8 163.8-162.8c90.5 0 163.8 72.9 163.8 162.8 0 90-73.3 162.8-163.8 162.8z"></path></svg>');
                                }
                            }
                            if(f.name === 'mapTime'){
                                if(!!f.componentsObj.comsvgHtml){
                                    $("#"+ f.id).find(".shape_canvas").html(f.componentsObj.comsvgHtml);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").html('<div class="mapTimeDiv"><p><span>10:24</span><small>AM</small></p><p><i>2017/09/26</i><em>星期二</em></p></div>');
                                }
                                if(!!f.props.w){
                                    $("#"+ f.id).find(".shape_canvas").css("width",f.props.w+"px");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("width","195px");
                                }
                            }
                            if(f.name === "arrow"){
                                if(!!f.fontStyle.color){
                                    $("#"+ f.id).find(".shape_canvas").css("color", " rgb(" + f.fontStyle.color + ")");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("color", " rgb(226, 170, 0)");
                                }
                                if(!!f.componentsObj.comsvgHtml){
                                    $("#"+ f.id).find(".shape_canvas").html(f.componentsObj.comsvgHtml);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height: 100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1"  xmlns="http://www.w3.org/2000/svg" ><path d="M555.853 62l406.147 450-406.147 450zM62 292.625h624.015v438.75h-624.015v-438.75z" ></path></svg>');
                                }
                            }
                            if(f.name === "obstacle"){
                                if(!!f.fontStyle.color){
                                    $("#"+ f.id).find(".shape_canvas").css("color", " rgb(" + f.fontStyle.color + ")");
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("color", " rgb(127, 127, 127)");
                                }
                                if(!!f.componentsObj.comsvgHtml){
                                    $("#"+ f.id).find(".shape_canvas").html(f.componentsObj.comsvgHtml);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height: 100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M70.144 65.024v893.952h893.952V65.024H70.144z m464.896 564.224V512h235.008l-235.008 235.008v-117.76z m-35.84 281.6h-245.76l245.76-245.76v245.76z m35.84-109.568L824.32 512h92.16v107.008l-291.84 291.84h-89.088v-109.568zM916.48 472.064h-222.72L916.48 249.344v222.72z m0-286.208l-286.208 286.208h-94.72V402.432L825.344 112.64H916.48v73.216zM118.272 402.432L408.064 112.64h91.648v74.752L214.528 472.064H118.272V402.432z m416.768-201.216V113.152h229.888L535.04 343.04V201.216zM357.376 512L117.76 751.616V512h239.616z m-93.184-39.936l235.008-235.008v235.008H264.192z m88.064-358.912L118.272 347.136V113.152h233.984zM118.272 811.52L417.792 512h81.408v102.4l-296.96 296.96H118.272v-99.84z m557.056 99.328l241.152-241.152v241.152h-241.152z" ></path></svg>');
                                }
                            }
                            if(f.name === "uploadPhoto"){
                                if(!!f.componentsObj.imgurl){
                                    $("#"+ f.id).find(".shape_canvas img").attr("src", f.componentsObj.imgurl );
                                }else{
                                    $("#"+ f.id).find(".shape_canvas img").attr("src", "assets/images/imgDefault.png");
                                }
                            }
                            if(f.name === "addComputer"){
                                cp_width= f.props.w;
                                cp_size= f.fontStyle.size;
                                if(!!f.componentsObj.computerNum){
                                    $("#"+ f.id).find(".shape_canvas .cpNum").val(f.componentsObj.computerNum);
                                    $("#"+f.id+" .shape_canvas").attr("data-val",f.componentsObj.computerNum);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas .cpNum").val("");
                                    $("#"+f.id+" .shape_canvas").attr("data-val","");
                                }

                                if(!!f.componentsObj.computerBgColor){
                                    $("#"+ f.id).find(".shape_canvas").css("background-color", " rgb(" + f.componentsObj.computerBgColor + ")");
                                    $("#"+ f.id).find(".shape_canvas").children('input,span').css("background-color"," rgb(" + f.componentsObj.computerBgColor2 + ")");
                                    $("#"+ f.id+" .shape_canvas").attr("data-state",f.componentsObj.state);
                                }else{
                                    $("#"+ f.id).find(".shape_canvas").css("background-color", " #146b81");
                                    $("#"+ f.id).find(".shape_canvas").children('input,span').css("background-color"," #2290ab");
                                    $("#"+ f.id+" .shape_canvas").attr("data-state",0);
                                }
                            }
                            if(!!Model.define.elements[f.id]){
                                Model.define.elements[f.id].locked = f.locked;
                            }
                            Utils.unselect();
                        }
                        var e = Utils.getSelectedIds();
                        Utils.selectShape(e, false);
                    } else {
                        if (g.action == "remove") {
                            $(".computer-top-nav").hide();
                            var b = g.content;
                            Model.addMulti(b);
                            for (var c = 0; c < b.length; c++) {
                                (function(){
                                    var f = b[c];
                                    Designer.painter.renderShape(f, function(){
                                        MessageSource.removeUpdataComponent(f);
                                    });
                                })();
                            }
                        } else {
                            if (g.action == "updatePage") {
                                Model.updatePage(g.content.page);
                            } else {
                                if (g.action == "setTheme") {
                                    Model.setTheme(g.content.theme);
                                }
                            }
                        }
                    }
                }
                var str=$(".text_content").text();
                var prevw = parseInt(str.substring(0,str.indexOf("*"))),
                    prevh= parseInt(str.substring(str.indexOf("*")+1));
                $(".text_content").text(Model.define.page.width + " * " + Model.define.page.height);
                $("#canvas_container").css({backgroundImage:"url("+Model.define.page.backgroundImage+")"});
                var imgLi=$(".wallPaperList li");
                for(var imgN=0;imgN < imgLi.length;imgN++){
                    if("images/bj/"+$(imgLi[imgN]).data("bj") === Model.define.page.backgroundImage){
                        $(imgLi[imgN]).addClass("action").siblings().removeClass("action");
                        break;
                    }
                }
                $(" .sliderBf" ).slider("value",cp_width) ;
                $(" .fuChuang" ).html(cp_width+"px") ;
                $(".text_cp").html(cp_size+"px");
                var b = g.content.shapes;
                MessageSource.updataCompontent(g,b);
                cpWSetShow();
                var gss = Model.define.page.width,
                    iss = Model.define.page.height;
                if(gss != prevw || iss != prevh){
                    for(var jsa in Model.define.elements){
                        var el = Model.define.elements[jsa],
                            xcount = gss / prevw,
                            ycount = iss / prevh,
                            xsize = el.props.x * xcount,
                            ysize = el.props.y * ycount;
                        Model.define.elements[jsa].props.x = xsize;
                        Model.define.elements[jsa].props.y = ysize;
                        $("#"+ jsa).css({
                            "left": xsize + "px",
                            "top": ysize + "px"
                        });
                    }
                }
                if(!!b){
                    if(b.length === undefined){
                        if(b.componentsObj){
                            Model.define.elements[b.id].componentsObj = $.extend(true, {}, b.componentsObj);
                        }
                    }else{
                        for(var tsi = 0, tslen = b.length; tsi < tslen; tsi++){
                            Model.define.elements[b[tsi].id].componentsObj = $.extend(true, {}, b[tsi].componentsObj);
                        }
                    }
                }
            }
            MessageSource.commit();
            OPERATION = false;
        });
    },
    redo: function () {
        var a = this.redoStack.pop();
        if (a == null) {
            return;
        }
        this.doWithoutUndo(function () {
            MessageSource.executeMessages(a, false);
        })
    },
    executeMessages: function (e, j) {
        MessageSource.beginBatch();
        for (var f = 0; f < e.length; f++) {
            var c = e[f];
            if (c.action == "create") {
                var b = c.content;
                if (j) {
                    for (var h = 0; h < b.length; h++) {
                        var g = b[h];
                        Schema.initShapeFunctions(g)
                    }
                }
                Model.addMulti(b);
                for (var h = 0; h < b.length; h++) {
                    var g = b[h];
                    Designer.painter.renderShape(g)
                }
                Model.build();
            } else {
                if (c.action == "update") {
                    var k = c.content.updates;
                    for (var h = 0; h < k.length; h++) {
                        var d = k[h];
                        Schema.initShapeFunctions(d);
                        if(!!d.props.angle){
                            $("#"+ d.id).css({
                                "-ms-transform":" rotate("+ d.props.angle*180/Math.PI +"deg)",
                                "-moz-transform":" rotate("+ d.props.angle*180/Math.PI +"deg)",
                                "-webkit-transform":" rotate("+ d.props.angle*180/Math.PI +"deg)",
                                "-o-transform":" rotate("+ d.props.angle*180/Math.PI +"deg)",
                                "transform":" rotate("+ d.props.angle*180/Math.PI +"deg)"
                            });
                        }else{
                            $("#"+ d.id).css({
                                "-ms-transform":" rotate(0deg)",
                                "-moz-transform":" rotate(0deg)",
                                "-webkit-transform":" rotate(0deg)",
                                "-o-transform":" rotate(0deg)",
                                "transform":" rotate(0deg)"
                            });
                        }
                        if(d.name === "longstring" ){
                            if(!!d.lineStyle.lineWidth){
                                $("#"+ d.id).find(".shape_canvas").css("width", d.lineStyle.lineWidth + "px");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("width","10px");
                            }
                            if(!!d.lineStyle.lineColor){
                                $("#"+ d.id).find(".shape_canvas").css("background-color"," rgb(" + d.lineStyle.lineColor + ")");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("background-color","#7F7F7F");
                            }
                        }
                        if(d.name === "transverseline" ){
                            if(!!d.lineStyle.lineWidth){
                                $("#"+ d.id).find(".shape_canvas").css("height", d.lineStyle.lineWidth + "px");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("height","10px");
                            }
                            if(!!d.lineStyle.lineColor){
                                $("#"+ d.id).find(".shape_canvas").css("background-color"," rgb(" + d.lineStyle.lineColor + ")");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("background-color","#7F7F7F");
                            }
                        }
                        if(d.name === "text"){
                            if(!!d.fontStyle.color){
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(" + d.fontStyle.color + ")");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("color", "#fff");
                            }
                            if(!!d.fontStyle.fontFamily){
                                $("#"+ d.id).find(".shape_canvas").css("font-family", d.fontStyle.fontFamily);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("font-family", "宋体");
                            }
                            if(!!d.fontStyle.size){
                                $("#"+ d.id).find(".shape_canvas").css("font-size", d.fontStyle.size);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("font-size","16px");
                            }
                            if(!!d.componentsObj.textAer){
                                $("#"+ d.id).find(".shape_canvas").val(d.componentsObj.textAer);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").val("请输入文字");
                            }
                        }
                        if(d.name === 'mapTime'){
                            if(!!d.componentsObj.comsvgHtml){
                                $("#"+ d.id).find(".shape_canvas").html(d.componentsObj.comsvgHtml);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").html('<div class="mapTimeDiv"><p><span>10:24</span><small>AM</small></p><p><i>2017/09/26</i><em>星期二</em></p></div>');
                            }
                            if(!!d.props.w){
                                $("#"+ d.id).find(".shape_canvas").css("width",d.props.w+"px");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("width","195px");
                            }
                        }
                        if(d.name === "myPlace"){
                            if(!!d.fontStyle.color){
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(" + d.fontStyle.color + ")");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(209, 91, 91)");
                            }
                            if(!!d.componentsObj.comsvgHtml){
                                $("#"+ d.id).find(".shape_canvas").html(d.componentsObj.comsvgHtml);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height:100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M839.2 388.8c0-179.8-146.6-325.6-327.6-325.6C330.7 63.2 184 209 184 388.8c0 59.4 16.3 114.9 44.2 162.8h-0.3l283.7 407 283.9-407h-0.5c28-48 44.2-103.4 44.2-162.8zM511.6 551.5c-90.5 0-163.8-72.9-163.8-162.8s73.3-162.8 163.8-162.8c90.5 0 163.8 72.9 163.8 162.8 0 90-73.3 162.8-163.8 162.8z"></path></svg>');
                            }
                        }
                        if(d.name === "arrow"){
                            if(!!d.fontStyle.color){
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(" + d.fontStyle.color + ")");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(226, 170, 0)");
                            }
                            if(!!d.componentsObj.comsvgHtml){
                                $("#"+ d.id).find(".shape_canvas").html(d.componentsObj.comsvgHtml);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height: 100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1"  xmlns="http://www.w3.org/2000/svg" ><path d="M555.853 62l406.147 450-406.147 450zM62 292.625h624.015v438.75h-624.015v-438.75z" ></path></svg>');
                            }
                        }
                        if(d.name === "obstacle"){
                            if(!!d.fontStyle.color){
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(" + d.fontStyle.color + ")");
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("color", " rgb(127, 127, 127)");
                            }
                            if(!!d.componentsObj.comsvgHtml){
                                $("#"+ d.id).find(".shape_canvas").html(d.componentsObj.comsvgHtml);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").html('<svg class="icon" style="width: 100%; height: 100%;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M70.144 65.024v893.952h893.952V65.024H70.144z m464.896 564.224V512h235.008l-235.008 235.008v-117.76z m-35.84 281.6h-245.76l245.76-245.76v245.76z m35.84-109.568L824.32 512h92.16v107.008l-291.84 291.84h-89.088v-109.568zM916.48 472.064h-222.72L916.48 249.344v222.72z m0-286.208l-286.208 286.208h-94.72V402.432L825.344 112.64H916.48v73.216zM118.272 402.432L408.064 112.64h91.648v74.752L214.528 472.064H118.272V402.432z m416.768-201.216V113.152h229.888L535.04 343.04V201.216zM357.376 512L117.76 751.616V512h239.616z m-93.184-39.936l235.008-235.008v235.008H264.192z m88.064-358.912L118.272 347.136V113.152h233.984zM118.272 811.52L417.792 512h81.408v102.4l-296.96 296.96H118.272v-99.84z m557.056 99.328l241.152-241.152v241.152h-241.152z" ></path></svg>');
                            }
                        }
                        if(d.name === "uploadPhoto"){
                            if(!!d.componentsObj.imgurl){
                                $("#"+ d.id).find(".shape_canvas img").attr("src", d.componentsObj.imgurl );
                            }else{
                                $("#"+ d.id).find(".shape_canvas img").attr("src", "assets/images/imgDefault.png");
                            }
                        }
                        if(d.name === "addComputer"){
                            cp_width= d.props.w;
                            cp_size= d.fontStyle.size;
                            if(!!d.componentsObj.computerNum){
                                $("#"+ d.id).find(".shape_canvas .cpNum").val(d.componentsObj.computerNum);
                                $("#"+d.id+" .shape_canvas").attr("data-val",d.componentsObj.computerNum);
                            }else{
                                $("#"+ d.id).find(".shape_canvas .cpNum").val("");
                                $("#"+d.id+" .shape_canvas").attr("data-val","");
                            }
                            if(!!d.componentsObj.computerBgColor){
                                $("#"+ d.id).find(".shape_canvas").css("background-color", " rgb(" + d.componentsObj.computerBgColor + ")");
                                $("#"+ d.id).find(".shape_canvas").children('input,span').css("background-color"," rgb(" + d.componentsObj.computerBgColor2 + ")");
                                $("#"+ d.id+" .shape_canvas").attr("data-state",d.componentsObj.state);
                            }else{
                                $("#"+ d.id).find(".shape_canvas").css("background-color", " #146b81");
                                $("#"+ d.id).find(".shape_canvas").children('input,span').css("background-color"," #2290ab");
                                $("#"+ d.id+" .shape_canvas").attr("data-state",0);
                            }
                        }
                        Designer.painter.renderShape(d);
                    }
                    Model.updateMulti(k);
                    var a = Utils.getSelectedIds();
                    Utils.unselect();
                    Utils.selectShape(a)
                } else {
                    if (c.action == "remove") {
                        $(".computer-top-nav").hide();
                        Utils.unselect();
                        Model.remove(c.content)
                        MessageSource.removeUpdataComponent(f);
                    } else {
                        if (c.action == "updatePage") {
                            Model.updatePage(c.content.update)
                        } else {
                            if (c.action == "setTheme") {
                                Model.setTheme(c.content.update)
                            }
                        }
                    }
                }
            }
            var str=$(".text_content").text();
            var prevw = parseInt(str.substring(0,str.indexOf("*"))),
                prevh= parseInt(str.substring(str.indexOf("*")+1));
            $(".text_content").text(Model.define.page.width + " * " + Model.define.page.height);
            $("#canvas_container").css({backgroundImage:"url("+Model.define.page.backgroundImage+")"});
            var imgLi=$(".wallPaperList li");
            for(var imgN=0;imgN < imgLi.length;imgN++){
                if("images/bj/"+$(imgLi[imgN]).data("bj") === Model.define.page.backgroundImage){
                    $(imgLi[imgN]).addClass("action").siblings().removeClass("action");
                    break;
                }
            }
            $(" .sliderBf" ).slider("value",cp_width) ;
            $(" .fuChuang" ).html(cp_width+"px") ;
            $(".text_cp").html(cp_size+"px");
            var b = c.content.updates;
            MessageSource.updataCompontent(g,b);
            cpWSetShow();
            var gss = Model.define.page.width,
                iss = Model.define.page.height;
            if(gss != prevw || iss != prevh){
                for(var jsa in Model.define.elements){
                    var el = Model.define.elements[jsa],
                        xcount = gss / prevw,
                        ycount = iss / prevh,
                        xsize = el.props.x * xcount,
                        ysize = el.props.y * ycount;
                    Model.define.elements[jsa].props.x = xsize;
                    Model.define.elements[jsa].props.y = ysize;
                    $("#"+ jsa).css({
                        "left": xsize + "px",
                        "top": ysize + "px"
                    });
                }
            }

            if(!!b){
                if(b.length === undefined){
                    if(b.componentsObj){
                        Model.define.elements[b.id].componentsObj = $.extend(true, {}, b.componentsObj);
                    }
                }else{
                    for(var tsi = 0, tslen = b.length; tsi < tslen; tsi++){
                        Model.define.elements[b[tsi].id].componentsObj = $.extend(true, {}, b[tsi].componentsObj);
                    }
                }
            }
        }
        MessageSource.commit();
    },
    doWithoutUndo: function (a) {
        this.withUndo = false;
        a();
        this.withUndo = true
    }
};
//元素按比例缩放
Number.prototype.toScale = function () {
    return this * Designer.config.scale;
};
//恢复元素大小
Number.prototype.restoreScale = function () {
    return this / Designer.config.scale;
};

Date.prototype.format = function (b) {
    var c = {
        "M+": this.getMonth() + 1,
        "d+": this.getDate(),
        "h+": this.getHours(),
        "m+": this.getMinutes(),
        "s+": this.getSeconds(),
        "q+": Math.floor((this.getMonth() + 3) / 3),
        S: this.getMilliseconds()
    };
    if (/(y+)/.test(b)) {
        b = b.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length))
    }
    for (var a in c) {
        if (new RegExp("(" + a + ")").test(b)) {
            b = b.replace(RegExp.$1, RegExp.$1.length == 1 ? c[a] : ("00" + c[a]).substr(("" + c[a]).length))
        }
    }
    return b
};

var dateFormat = "yyyy-MM-dd hh:mm";
var g = new Date();
// //console.log(g.format(dateFormat));
// window.onresize = function () {
//     var a = IS_FULL_SCREEN ? $(window).height() : $(window).height() - $("#designer_header").outerHeight();
//     $(".leftMenu").height(a);
//     $("#designer_layout").height(a );
// }